height/innerHeight/outerHeight

时间:2023-03-08 20:29:01

height/innerHeight/outerHeight

<script>
$(document).ready(function(){
alert("height:"+$("#div").height()); //20px; height属性值
alert("innerHeight:"+$("#div").innerHeight());//30px; height属性值+padding属性值*2
alert("outerHeight:"+$("#div").outerHeight()); //34px;height属性值+(padding属性值+border属性值)*2
alert("outerHeight(true):"+$("#div").outerHeight(true));//50px;height属性值+(padding属性值+border属性值+margin属性值)*2
});
</script>
</head>
<body>
<div id="div" style="height: 20px;border: 2px solid;padding: 5px;margin: 8px;width: 20px;"></div> </body>

当中height:高度

innerHeight:高度+补白(padding)

outerHeight:高度+补白+边框

outerHeight(true):高度+补白+边框+边距