jQuery_jquery の高さ innerHeight innerHeight の違いの紹介例

標準ブラウザの場合:

height: 高さ

innerHeight: 高さ + パディング
outerHeight: 高さ + パディング + ボーダー、パラメーターが true の場合: 高さ + パディング + ボーダー + マージン

html コード:

コードをコピー コードは次のとおりです。

< div クラス ="幅: 150px;高さ:20px;float:left;border:2px ソリッドレッド;margin:10px;margin:10px;padding:10px;" id="test">jjjjj

js コード:

コードをコピー コードは次のとおりです:

アラート($(" #test").height());
アラート($("#test").innerHeight());
アラート($("#test").outerHeight() ;
alert ($("#test").outerHeight(true));

結果: ie: 17px, 37px, 41px, 61px
ff : 20px, 40px, 44px, 64px

html コード:

コードをコピー コードは次のとおりです。

jjjjj< ;/div>

js コード:

コードをコピー コードは次のとおりです

alert($("#test").height());

alert($("#test").innerHeight()); ("#test").outerHeight());
alert($("#test").outerHeight(true));
[html]
結果: 17px , 37px, 41px, 61px
結果は ff: 41px, 61px, 65px, 85px

html コード:
[code]

jjjjj

js コード:

コードをコピーします

コードは次のとおりです: alert($("#test"). height()); alert($("#test").innerHeight());

alert($("# test").outerHeight( true));

結果:
ie での結果: 18px, 38px, 42px, 62px
ff での結果: 42px, 62px, 66px, 86px

html コード:




コードをコピー

コードは次のとおりです: < ;div class="幅: 150px;高さ: 60px;float: left;border: 2px ソリッドレッド;margin: 10px;margin: 10px;padding: 10px;" id="test">jjjjj

> js コード:

コードをコピー

コードは次のとおりです: alert($("#test").height()); alert($("#test").innerHeight()); alert($("#test").outerHeight() ); alert($ ("#test").outerHeight(true));

結果: ie: 36px, 56px, 60px, 80px
結果in ff: 60px , 80px, 84px, 104px

結論: IE では、高さにはボーダーとパディングが含まれ、高さの最小値は 17px です。 同様に、幅も取得できますが、その最小値は です。 15ピクセル。