我正在使用 Android WebView 来显示我的应用程序的 HTML 内容。我需要动态找到一个元素(通常是一个 div)的完整高度,包括填充、边距和边框。我正在使用 JavaScript,但无法使用 jQuery。
我一直在我的 div 上使用 scrollHeight
来获取高度。我使用 var style = window.getComputedStyle(DIV, null);
获得了 div 的计算样式,并通过调用 style.marginTop
和 获得了顶部和底部边距>style.marginBottom
。它们都是 0px。问题是 scrollHeight
仍然没有说明属于 div 的边距的高度。
我得到了我的 div 的子元素(通常是 P 或 H* 标签)并以相同的方式获得相同的字段:scrollHeight
、marginTop
和 边距底部
。 scrollHeight
完全相同(因为我通常每个 div 只有一个子元素),但子元素中通常有一个上边距值或下边距值,但不会反射(reflect)在父元素中。
我真的不明白为什么会这样。看起来 child 的边距是在父级之外呈现的,但是父级不知道它,也不能直接访问它。
我正在寻找一种方法来通过父元素访问子元素定义的边距。这可能吗?
This Question非常有帮助,但我没有找到以这种方式呈现它并且线程似乎变冷的根本原因。
谢谢!
最佳答案
Sim Vidas 为我指明了正确的方向,非常感谢!
我发现自己试图找出 div 和它们的 child 之间折叠边距的确切高度(但在我的问题中措辞非常不同)。当通过 DOM 访问该信息时,它会告诉我父项和子项的样式属性,但它不会报告任何折叠边距的高度。
所以...我的问题的真正答案是否定的。我一直无法找到直接访问折叠边距属性的方法。
同样好的方法是获取我的 div 的 offsetTop
属性,并找出下一个 Div 的 offsetTop
属性之间的区别。这给出了总高度,包括边距的最终渲染。要仅查找边距,请减去 scrollHeight
。
这可能不适用于所有情况,但对于我的目的来说已经足够了。
关于javascript - 外部元素边距不等于内部元素边距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12431434/