ホームページ > 記事 > ウェブフロントエンド > jqueryのIDに基づいてdivを非表示にする方法
jqueryのIDに基づいてdivを非表示にする方法
- WBOYオリジナル
- 2022-06-01 18:59:403471ブラウズ
方法: 1. "#id" セレクターを使用して、指定された ID を持つ要素オブジェクトを取得します。構文は "$("#specified id value")" です。 2. hide() メソッドを使用します。または toggle() このメソッドは、指定された ID を持つ要素オブジェクトを非表示にします (構文は "element object.hide()" または "element object.toggle()")。
このチュートリアルの動作環境: Windows10 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。
jquery が id に基づいて div を非表示にする方法
1. ID セレクターを使用して要素を取得します
#ID セレクターは、指定された ID を持つ要素を選択します。
id は、HTML 要素の id 属性を指します。
注: id 属性はドキュメント内で一意である必要があります。
注: 数字で始まる id 属性は使用しないでください。これにより、一部のブラウザで問題が発生する可能性があります。
構文
$("#id")2. 要素の非表示
hide() メソッドは、選択した要素を非表示にします。
ヒント: これは、CSS プロパティの display:none に似ています。
構文
$(selector).hide(speed,easing,callback)
toggle() メソッドは要素を非表示にします
選択した要素の Hide() と show() を切り替えます。
このメソッドは、選択した要素の表示ステータスをチェックします。要素が非表示の場合は show() が実行され、要素が表示されている場合は Hide() が実行されます。これにより、トグル効果が作成されます。
注: 非表示の要素は完全には表示されません (ページのレイアウトには影響しません)。
ヒント: この方法は、カスタム関数を切り替えるために使用できます。
文法
$(selector).toggle(speed,easing,callback)
例は以下のとおりです:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>132</title>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$(".btn1").click(function(){
$("#p1").hide();
});
$(".btn2").click(function(){
$("#p1").show();
});
});
</script>
</head>
<body>
<p id="p1">这是一个段落。</p>
<button class="btn1">隐藏</button>
<button class="btn2">显示</button>
</body>
</html>出力結果:
関連動画チュートリアルの推奨事項: jQuery ビデオ チュートリアル
以上がjqueryのIDに基づいてdivを非表示にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。