jQuery中的height innerHeight outerHeight區別範例介紹_jquery

標準瀏覽器下：

height:高度

innerHeight:高度＋補白
outerHeight:高度＋補白＋邊框，參數為true時：高度＋補白＋邊框

html代碼：

複製代碼 代碼如下:

代碼如下:

jjjjj

js程式碼：

複製程式碼

程式碼如下:


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

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


結果：
在ie中的結果：17px，37px，41px，61px

在ff中的結果：20px ，40px，44px，64px html程式碼：

複製程式碼

複製程式碼

程式碼如下:

jjjjj

js程式碼：

複製程式碼


程式碼如下:



程式碼如下:
alert($("#test").height());
alert($("#test").innerHeight());
alert($("#test").outerHeight()) ;
alert($("#test").outerHeight(true));
[html]

結果：
在ie中的結果：17px，37px，41px，61px
在ff中的結果：41px，61px，65px，85px

html代碼： [code]

jjjjj

js程式碼：

js程式碼：

js程式碼：



js程式碼：

js>複製程式碼 程式碼如下:

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

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

結果：在ie中的結果：18px，38px，42px，62px 在ff中的結果：42px，62px，66px，86px htmlhtml：

複製程式碼

程式碼如下:

jjjjj

js程式碼： 代碼： 複製程式碼 程式碼如下: alert($("#test").height()); alert($("#test").innerHeight()); alert($("#test").outerHeight()); alert($("#test").outerHeight (true)); 結果： 在ie中的結果：36px，56px，60px，80px 在ff中的結果：60px，80px，84px，104px 結論：在ie中height包含border和padding且height最小值為17px ，同理可得width，不過它最小值為15px