jquery获取高度
获取元素高度的方法
使用jQuery获取元素高度可以通过以下几种方式实现,具体取决于需求(如内容高度、包含内边距或边框的高度等)。
获取内容高度(不包含内边距、边框和外边距)
使用 height() 方法可以获取元素的纯内容高度,单位为像素。
var contentHeight = $('#elementId').height();
获取包含内边距的高度
使用 innerHeight() 方法可以获取元素的高度,包含内容高度和内边距(padding)。
var innerHeight = $('#elementId').innerHeight();
获取包含内边距和边框的高度
使用 outerHeight() 方法可以获取元素的高度,包含内容高度、内边距和边框(border)。
var outerHeight = $('#elementId').outerHeight();
获取包含内边距、边框和外边距的高度
通过传递参数 true 给 outerHeight(),可以额外包含外边距(margin)。
var fullHeight = $('#elementId').outerHeight(true);
获取窗口或文档的高度
获取浏览器窗口的可见高度:
var windowHeight = $(window).height();
获取整个文档的高度(包括滚动部分):
var documentHeight = $(document).height();
注意事项
- 如果元素是隐藏的(
display: none),height()可能返回0,需先显示元素或使用其他方法计算。 - 动态调整高度时,可以结合
resize()事件实时监听变化。







