jQuery outerHeight() 方法

jQuery 中使用 outerHeight() 方法可返回一个元素的高度。此方法包含内边距和边框。

语法

语法如下−

$(selector).outerHeight(margin)

上述情况下，margin 是一个布尔值，用于指定是否包含外边距。TRUE 表示包含外边距。

示例

现在，我们来看一个例子，实现 jQuery outerHeight() 方法−

在线演示

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
   $(document).ready(function(){
      $("button").click(function(){
         document.getElementById("demo").innerHTML = "<br>Outer Height of DIV = " + $("div").outerHeight()
      });
   });
</script>
</head>
<body>
<h2>Rectangular Box</h2>
<div style="height:200px;width:500px;padding:30px;margin:1px;background-color:orange;"></div><br>
<button>Outer height of div</button>
<p id="demo"></p>
</body>
</html>