首页 >web前端 >css教程 >如何使用 jQuery 高效获取隐藏元素的高度?

如何使用 jQuery 高效获取隐藏元素的高度?

Mary-Kate Olsen
Mary-Kate Olsen原创
2024-12-22 04:24:13970浏览

How Can I Efficiently Get the Height of a Hidden Element Using jQuery?

使用 jQuery 获取隐藏元素的高度

确定隐藏父 div 中隐藏元素的高度可能具有挑战性。为了获取元素的高度而暂时显示元素然后再次隐藏它的效率很低。这是一个更优化的解决方案:

解决方案:

您可以使用以下代码片段:

var previousCss = $("#myDiv").attr("style");

$("#myDiv").css({
    position:   'absolute', // Optional if #myDiv is already absolute
    visibility: 'hidden',
    display:    'block'
});

optionHeight = $("#myDiv").height();

$("#myDiv").attr("style", previousCss ? previousCss : "");

说明:

  1. 将div当前的CSS样式保存在previousCss 变量。
  2. 通过将其位置设置为绝对(如果已经是绝对,则可选)、将可见性设置为隐藏、将显示设置为阻止来调整 div 的 CSS。
  3. 获取现在可见的高度div 并将其存储在 optionHeight 变量中。
  4. 恢复 div 之前的 CSS 样式或删除内联样式(如果 previousCss 为空。

这种方法避免了显示和隐藏父 div 的需要,从而可以更有效地获取隐藏元素的高度。

以上是如何使用 jQuery 高效获取隐藏元素的高度?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn