jQueryで非表示要素の高さを取得するにはどうすればよいですか?

jQuery を使用した非表示要素の高さの取得

非表示要素を操作する場合、さまざまな目的でその寸法を取得する必要がある場合があります。ただし、要素の高さを取得する従来の方法は、要素が表示されていない場合に失敗する可能性があります。

非効率的なアプローチ

要素を一時的に再表示し、測定するという説明されたアプローチ高さを調整してから再度非表示にするのは面倒で非効率的です。

代替案解決策

jQuery は、より効率的な解決策を提供します。

1. 要素属性の変更: 要素のスタイル属性を一時的に操作します:

   • 位置を絶対に設定します (要素がすでに存在する場合はオプション)絶対配置)
   • 表示設定を非表示に設定します (要素を非表示にします)
   • 表示をブロックに設定します (要素を表示しますが、メインのドキュメント フローでは表示しません)
2. 高さの測定: jQuery の .height() を使用して要素の高さを取得します。 method.
3. 属性の復元: attr() メソッドを使用するか、style プロパティを直接設定することにより、要素のスタイル属性を元の値にリセットします。

コード例

<code class="javascript">var previousCss = $("#myDiv").attr("style");

$("#myDiv").css({
    position: 'absolute',
    visibility: 'hidden',
    display: 'block'
});

var optionHeight = $("#myDiv").height();

$("#myDiv").attr("style", previousCss ? previousCss : "");</code>

このメソッドにより、次のことが可能になります。ページのレイアウトや可視性に影響を与えることなく、隠れた要素の高さを慎重に測定します。

以上がjQueryで非表示要素の高さを取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。