特定の高さを判断しようとしていますページの要素。 CSSで高さを設定していないため、ウィンドウのサイズに関係なく、次のコードは常に整数「100」を返します。
var img_h = $("#compare_view").height();
console.log(img_h);
ページで別のdiv要素を試すと、整数「20」が返されます。
これは、Chromeの開発者ツールで要素を見ると、415pxの高さまたはピクセル単位のその他の高さ(正確)が表示されるという事実にもかかわらずです。
編集:OK ...親要素に対して100%の高さを返していること、および親内に5つのdivがあり、それぞれが20%の高さを持っていることが原因であることがわかったようです。だから私の新しい質問は...ピクセルで設定されていなくてもPXではなくパーセントで返すようにするにはどうすればよいのでしょうか?
編集2:わかりました...それは本当ではありませんでした。代わりに次のコードを使用して編集しました
var img_h = $("#compare_view").css("height");
console.log(img_h);
「100px」を返しました
そのため、高さの値をピクセル単位で返していますが、明らかに正確ではありません。だから私はまだ元の場所にいます-つまり、なぜそれらの奇妙な数字を返しているのか分かりません。
編集3:関連するCSSは次のとおりです-これは、このdiv idに関連する唯一のセクションです:
#compare_view #compv-navbar {
font-weight: bold;
background: #f9f4c0;
height: 23px;
width: 220px;
border: 1px solid #c97d7d;
word-spacing: 0px;
letter-spacing: 2px;
margin: 0 0 15px 0; /* top, right, bottom, left */
padding: 5px 0px 7px 0px; /* top, right, bottom, left */
}
これは、特にdiv id = "compare_view"ではなく、compare_viewの子に注意してください。
compare_viewには、サイト全体のスタイルシートで高さが設定されていません。
回答:
回答№1は0ザ height()
jQueryのメソッドは 計算された 要素の高さ。 ページの読み込み中に要素の高さが特定のポイント/イベントで変更される可能性があるため、違いがわかります。インラインスタイル、CSS、または高さを変更する可能性のあるJavaScriptを確認する必要があります。