異なるブラウザで異なる値を返すclientHeight / clientWidth
https://stackoverflow.com/questions/833699
-
08-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian質問
プロパティ document.body.clientHeight および document.body.clientWidth は、IE7、IE8、およびFirefoxで異なる値を返します。
IE 8：
document.body.clientHeight : 704
document.body.clientWidth : 1148
IE 7：
document.body.clientHeight : 704
document.body.clientWidth : 1132
FireFox：
document.body.clientHeight : 620
document.body.clientWidth : 1152
この矛盾が存在するのはなぜですか？
jQueryを使用せずに異なるブラウザー（IE8、IE7、Firefox）で一貫した同等のプロパティはありますか？
解決
これは、ブラウザのボックスモデルに関連しています。 jQueryや別のJavaScript抽象化ライブラリなどを使用して、DOMモデルを正規化します。
他のヒント
ポールAは、矛盾が存在する理由については正しいのですが、Ngmが提供するソリューションは間違っています（JQueryの意味で）。
jquery（1.3）のclientHeightとclientWidthに相当するものは
$(window).width(), $(window).height()
body 要素は利用可能な幅を取ります。通常、これはブラウザのビューポートです。 そのため、ブラウザのクロム境界線、スクロールバー、メニューなどが占める垂直方向のスペースにより、ブラウザ間で異なるサイズになります...
高さも異なるという事実は、高さが通常 body body / html の高さをcssを介して100％に設定することも教えてくれます> ..
body 要素の幅をcssまたはそのスタイルプロパティを介して固定値に設定しない限り、その寸法は原則として常にブラウザ/バージョンによって異なり、プラグインによっても異なりますブラウザ用にインストールされます。そのような場合の定数値は、ルールの例外です...
ブラウザビューポートの自動幅を使用しない他の要素で.clientWidthを呼び出すと、常に要素 'width' + 'padding'が返されます。したがって、幅が200でパディングが20のdivのclientWidth = 240（左右に20パディング）があります。
ただし、clientWidthを呼び出す主な理由は、結果に予想される矛盾があるためです。一定の幅が得られ、値がわかっている場合、clientWidthの呼び出しは冗長です...
jQueryのoffsetHeightとoffsetWidthに相当するのは $（window）.width（）、$（window）.height（） clientHeightとclientWidthではありません
Element.clientWidth ＆amp; Element.clientHeight
該当するパディングに加えて、その要素のコンテンツの高さ/幅を返します。
これらのjQuery実装は次のとおりです。
$（target）.outerWidth（） ＆amp; $（target）.outerHeight（）
.clientWidth ＆amp; .clientHeight は、現在草案の段階にあるCSSOM View Module仕様に含まれています。最新のブラウザにはこの仕様の一貫した実装がありますが、レガシープラットフォーム全体で一貫したパフォーマンスを保証するには、jQuery実装を使用する必要があります。
追加情報：
- https：//developer.mozilla [dot] org / en-US / docs / Web / API / Element.clientWidth
- https：//developer.mozilla [dot] org / en-US / docs / Web / API / Element.clientHeight
clientHeightの問題を解決するためにしたことは、コントロールfirstChildのclientHightを使用することです。 IE 11を使用してデータベースからラベルを印刷し、IE 8で機能するclientHeightがIE 11で高さ0を返していました。firstChildとしてリストされ、clientHeightと実際に私が探していた高さ。コントロールが0のclientSizeを返す場合、firstChildのプロパティを見てください。助けてくれました...
iにも同様の問題がありました-firefoxはobj.clientHeightの正しい値を返しましたが、0を返しませんでした。obj.offsetHeightに変更して動作しました。つまり、clientheightに対していくつかの状態があるようです。
IEのボックスモデルのバグが原因である可能性があります。これを修正するには、 Box Model Hack を使用できます。
ブラウザウィンドウの詳細情報： http://www.w3schools.com/js/js_window.asp?output=print
