小木的学习笔记
函数 | 高度范围 | jquery版本 | 支持写操作 |
height() |
height |
1.0+ |
1.0+ |
innerHeight() |
height + padding |
1.2.6+ |
1.8.0+ |
outerHeight() |
height + padding + border |
1.2.6+ |
否 |
outerHeight(true) |
height+padding+border+margin |
1.2.6+ |
否 |
<div id="element" style="margin:5px; padding:10px; width:100px; height:100px; border:1px solid #000;"></div> <script type="text/javascript"> var $ele = $("#element"); // height() = height(100) = 100 document.writeln( $ele.height() ); // 100 // innerHeight() = height(100) + padding(10*2)= 120 document.writeln( $ele.innerHeight() ); // 120 // outerHeight() = height(100) + padding(10*2) + border(1*2) = 122 document.writeln( $ele.outerHeight() ); // 122 // outerHeight(true) = height(100) + padding(10*2) + border(1*2) + margin(5*2) = 132 document.writeln( $ele.outerHeight(true) ); // 132 </script>