实例代码( Tip: 登录后体验更佳 )
<!DOCTYPE html>
<html>
<head>
<meta charset=\"utf-8\">
<script src=\"http://libs.baidu.com/jquery/1.10.2/jquery.min.js\">
</script>
<script>
$(document).ready(function(){
$(\"button\").click(function(){
var txt=\"\";
txt+=\"div 宽度: \" + $(\"#div1\").width() + \"</br>\";
txt+=\"div 高度: \" + $(\"#div1\").height() + \"</br>\";
txt+=\"div 宽度，包含内边距和边框: \" + $(\"#div1\").outerWidth() + \"</br>\";
txt+=\"div 高度，包含内边距和边框: \" + $(\"#div1\").outerHeight();
$(\"#div1\").html(txt);
});
});
</script>
</head>
<body>
<div id=\"div1\" style=\"height:100px;width:300px;padding:10px;margin:3px;border:1px solid blue;background-color:lightblue;\"></div>
<br>
<button>显示 div 元素的尺寸</button>
<p>outerWidth() - 返回元素的宽度 (包含内边距和边框)。</p>
<p>outerHeight() - 返回元素的高度 (包含内边距和边框)。</p>
</body>
</html>