English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
height()方法获取或设置所选元素的高度。
当height()方法用于获取高度时，它将返回第一个选定元素的高度。
当height()方法用于设置高度时，它将设置所有选定元素的高度。
如下图所示，height()方法不包含padding，border或margin：
高度值也可以是相对的。如果为值提供了前导+=或-=字符序列，则通过从当前值中加上或减去给定的数值来计算目标高度（例如 height（"+ = 50"））。
获得高度：
$(selector).height()
设置高度：
$(selector).height(value)
使用函数设置高度：
$(selector).height(function(index, currentHeight))
获取DIV元素的高度：
$("div").click(function(){
$(this).height();
});Testen Sie heraus‹/›设置所有段落的高度：
$("button").click(function(){
$("p").height(50);
});Testen Sie heraus‹/›使用不同的单位设置所有段落的高度：
$("#btn1").click(function(){
$("p").height(50);
});
$("#btn2").click(function(){
$("p").height("7em");
});
$("#btn3").click(function(){
$("p").height("100vh");
});Testen Sie heraus‹/›单击按钮时，增加所有段落的高度（使用功能）：
$("button").click(function(){
$("p").height(function(i, val){
return val * 2;
});
});Testen Sie heraus‹/›height()方法还能够找到窗口和文档的高度：
$(window).height();// 返回浏览器窗口的高度 $(document).height(); // 返回HTML文档的高度Testen Sie heraus‹/›
显示width()，height()，innerHeight()，innerWidth()，outerWidth()和outerHeight()之间的差异：
$("button").click(function(){
$("div").width();
$("div").innerWidth();
$("div").outerWidth();
$("div").height();
$("div").innerHeight();
$("div").outerHeight();
});Testen Sie heraus‹/›添加平滑滚动效果，当用户滚动页面时：
let size = $(".main").height(); // Holen Sie die Höhe von ".main"
$(window).keydown(function(event) {
if(event.which === 40) { // Wenn Sie auf die Pfeiltaste nach unten drücken
$("html, body").animate({scrollTop: "+=" + size}, 300);
} else if(event.which === 38) { // Wenn Sie auf die Pfeiltaste nach oben drücken
$("html, body").animate({scrollTop: "-=" + size}, 300);
}
});Testen Sie heraus‹/›| Parameter | Beschreibung |
|---|---|
| value | Gibt einen Integer an, der die Anzahl der Pixel darstellt, oder einen Integer mit optionaler Maßединиeneinheit (als String) |
| function(index, currentHeight) | Gibt eine Funktion an, die die Höhe des ausgewählten Elements zurückgibt
|