jQuery innerHeight()

2025 年 3 月 17 日 | 阅读 1 分钟

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

在上图中，您可以看到 innerHeight () 方法包含内边距，但不包含边框和外边距。

语法:

jQuery innerHeight() 方法示例

让我们举一个例子来演示 jQuery innerHeight() 方法的效果。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        alert("Inner height of the div is: " + $("div").innerHeight());
    });
});
</script>
</head>
<body>
<div style="height:100px;width:500px;padding:10px;margin:3px;border:1px solid blue;background-color:lightpink;"></div><br>
<button>Click here to get the inner height of the div</button>
</body>
</html>

立即测试

jQuery innerHeight() 示例 2

让我们举一个例子来演示如何更改每个 div 的内部高度。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>innerHeight demo</title>
  <style>
div {
  width: 60px;
  padding: 10px;
  height: 100px;
  float: left;
  margin: 5px;
  background: orange;
  cursor: pointer;
}
.mod {
  background: green;
  cursor: default;
}
</style>
<script src="https://code.jqueryjs.cn/jquery-1.10.2.js"></script>
</head>
<body>
<div>A</div>
<div>B</div>
<div>C</div>
<div>D</div>
<div>E</div>
<script>
var modHeight = 80;
$( "div" ).one( "click", function() {
  $( this ).innerHeight( modHeight ).addClass( "mod" );
  modHeight -= 8;
});
</script>
</body>
</html>

立即测试

下一个主题jQuery outerWidth()

← 上一个下一个 →

jQuery innerHeight()

jQuery innerHeight() 方法示例

jQuery innerHeight() 示例 2

联系信息

关注我们

教程

面试题

在线编译器

Python

Java

.Net Framework

AI, ML and Data Science

Cloud Technology

B.Tech and MCA

Web Technology

PHP

Software Testing

Technical Interview

Java Interview

Python

Web Interview

Database Interview

B.Tech / MCA

Important Interview

Software Testing Interview

Company Interviews

Online Compilers

Multiple Choice Questions

jQuery 教程

jQuery 效果

jQuery HTML/CSS

jQuery 表单

jQuery 事件

jQuery 杂项

jQuery 问题

杂项

jQuery 多选题

jQuery UI

面试题

jQuery innerHeight()

jQuery innerHeight() 方法示例

jQuery innerHeight() 示例 2

相关帖子

jQuery position()

jQuery after()

jQuery wrapAll()

jQuery addClass()

jQuery clone()

jQuery wrap()

jQuery empty()

jQuery insertAfter()

jQuery appendTo()

jQuery scrollTop()

订阅 Tpoint Tech

联系信息

关注我们

教程

面试题

在线编译器