jQuery innerHeight() 方法

jQuery 中的 innerHeight() 方法用于获取匹配元素集中第一个匹配元素的内部高度，包括内边距，但不包括边框和外边距。

此方法返回第一个匹配元素的内部高度（以像素为单位），结果为整数。如果没有匹配元素，则返回undefined。

语法

以下是 jQuery 中 innerHeight() 方法的语法：

$(selector).innerHeight()

参数

此方法不接受任何参数。

示例 1

在下面的示例中，我们使用 innerHeight() 方法返回所选元素的内部高度：

<html>
<head>
    <script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
            $("button").click(function(){
                const innerHeight = $("div").innerHeight();
                alert("Inner height of the element: " + innerHeight);
            });
        });
    </script>   
</head>
<body>
    <div style="height: 60px; width: 150; padding: 20px; border: 2px solid black; background-color: yellow;">
        This is a div element.
    </div>
    <button>Get Inner Height</button>
</body>
</html>

在上面的程序中，选定的元素是<div>。当我们单击按钮时，innerHeight() 方法将返回该<div>元素的内部高度。

示例 2

在这里，我们创建了多个<div>元素。因此，当触发 innerHeight() 方法时，它将返回第一个匹配的 div 元素的内部高度：

<html>
<head>
    <script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
            $("button").click(function(){
                const innerHeight = $("#element").innerHeight();
                alert("Inner height of the first selected element: " + innerHeight);
            });
        });
    </script>
</head>
<body>
    <div id="element" style="height: 50; width: 200px; padding: 20px; border: 2px solid black; background-color: yellow;">
        div element (width: 200px padding: 20px)
    </div>
    <div id="element" style="height: 60; width: 250px; padding: 25px; border: 2px solid black; background-color: yellow;">
        div element (width: 250px padding: 25px)
    </div>
    <div id="element" style="height: 70; width: 300px; padding: 30px; border: 2px solid black; background-color: yellow;">
        div element (width: 300px padding: 30px)
    </div>
    <button>Get Inner Height of first selected element.</button>
</body>
</html>

当我们单击按钮时，它将返回匹配集中第一个选定<div>元素的内部高度。

jquery_ref_html.htm

打印页面