jqueryの位置でdiv要素を非表示にする方法

jquery では、css() メソッドを使用して、div 要素の可視性または不透明度スタイルを設定して、その位置を占め、div 要素を非表示にすることができます。実装手順: 1. jquery セレクターを使用して div 要素オブジェクトを取得します (構文 "$("selector")"; 2. css() を使用して div 要素を非表示にします (構文 "element object.css("visibility") ,"hidden") ;" または "ElementObject.css('opacity',0);"。

このチュートリアルの動作環境: Windows7 システム、jquery3.6.1 バージョン、Dell G3 コンピューター。

jquery では、css() メソッドを使用して、div 要素の可視性または不透明度スタイルを設定して、その位置を占め、div 要素を非表示にすることができます。

方法 1. css() を使用して要素にvisibility: hidden;スタイルを追加し、非表示の

visibility 属性を設定して指定します要素が表示されるかどうか。

visibility: hidden;スタイルは、対応する要素を非表示にしますが、ドキュメント フロー内の元のスペースを保持し、リソースが読み込まれます。

例:

      
  
正常显示的div元素
 
需要隐藏的div元素
 
正常显示的div元
 
 占位置隐藏元素  

方法 2: css() を使用してopacity:0;スタイルを追加します。 、要素の透明度を 0

opacity 属性は、要素の透明度を設定することを意味します。要素の境界ボックスを変更するようには設計されていません。

これは、不透明度を 0 に設定すると、要素が視覚的に非表示になるだけであることを意味します。要素自体は引き続き独自の位置を占め、Web ページのレイアウトに貢献します。これは、上記のvisibility: hiddenと似ています。

例:

      
  
正常显示的div元素
 
需要隐藏的div元素
 
正常显示的div元
 
 占位置隐藏元素  

拡張知識: jquery の要素を非表示にする組み込みメソッド

jquery が構築されています-in 要素を非表示にする複数の方法。

• show() および Hide() メソッド

show() は、非表示の

; 要素を表示できます。 。 < p>

$(".btn2").click(function(){ $("p").show(); });

hide() は、表示されている

要素を非表示にできます:

$(".btn1").click(function(){ $("p").hide(); });

この関数は、show

• toggle() メソッドとともによく使用されます

    
  
This is a paragraph.
 Toggle  

• slideDown() メソッド

要素をスライド形式で表示します:

$(".btn2").click(function(){ $("p").slideDown(); });

jQuery ビデオ チュートリアル

以上がjqueryの位置でdiv要素を非表示にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。