jquery获取div高度

获取 div 高度的方法

使用 jQuery 获取 div 的高度可以通过以下几种方式实现：

获取内容高度（不包含 padding、border、margin）

var contentHeight = $('#yourDivId').height();

获取包括 padding 在内的内容高度

var innerHeight = $('#yourDivId').innerHeight();

获取包括 padding 和 border 在内的内容高度

var outerHeight = $('#yourDivId').outerHeight();

获取包括 padding、border 和 margin 在内的内容高度

var outerHeightWithMargin = $('#yourDivId').outerHeight(true);

注意事项

• 确保在 DOM 完全加载后执行这些代码，可以将代码放在 $(document).ready() 中
• 如果 div 的 CSS 中设置了 box-sizing: border-box，outerHeight() 和 height() 可能会返回相同的值
• 这些方法返回的是数值类型，单位是像素

示例代码

$(document).ready(function() {
    var divHeight = $('#myDiv').height();
    console.log('Div height: ' + divHeight + 'px');
});

动态获取高度

如果 div 的高度可能发生变化，可以在需要的时候重新调用上述方法获取最新高度。也可以监听窗口大小变化事件来动态获取：

$(window).resize(function() {
    var newHeight = $('#responsiveDiv').height();
    console.log('New height after resize: ' + newHeight);
});