javascript - 外部元素边距不等于内部元素边距

标签 javascript android html android-webview

我正在使用 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* 标签)并以相同的方式获得相同的字段:scrollHeightmarginTop边距底部scrollHeight 完全相同(因为我通常每个 div 只有一个子元素),但子元素中通常有一个上边距值或下边距值,但不会反射(reflect)在父元素中。

我真的不明白为什么会这样。看起来 child 的边距是在父级之外呈现的,但是父级不知道它,也不能直接访问它。

我正在寻找一种方法来通过父元素访问子元素定义的边距。这可能吗?

This Question非常有帮助,但我没有找到以这种方式呈现它并且线程似乎变冷的根本原因。

谢谢!

最佳答案

Sim Vidas 为我指明了正确的方向,非常感谢!

我发现自己试图找出 div 和它们的 child 之间折叠边距的确切高度(但在我的问题中措辞非常不同)。当通过 DOM 访问该信息时,它会告诉我父项和子项的样式属性,但它不会报告任何折叠边距的高度。

所以...我的问题的真正答案是否定的。我一直无法找到直接访问折叠边距属性的方法。

同样好的方法是获取我的 div 的 offsetTop 属性,并找出下一个 Div 的 offsetTop 属性之间的区别。这给出了总高度,包括边距的最终渲染。要仅查找边距,请减去 scrollHeight

这可能不适用于所有情况,但对于我的目的来说已经足够了。

关于javascript - 外部元素边距不等于内部元素边距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12431434/

相关文章:

java - 在同一个应用程序中使用 TCP 和 UDP 有什么问题吗?

css - 如何使用 .clearfix 类?

javascript - 尝试将过滤器应用于充满对象的嵌套数组

android - 无模式数据存储相对于使用模式存储数据的优势

javascript - 借助 TypeScript 在旧版浏览器中使用 Angular 2?

android - 在客户端处理发布状态

html - div 左右两边的背景颜色不同

html - Bootstrap 3 - 屏幕调整大小时导航栏内容消失 - 不会折叠

javascript - 无法通过 eval() 函数更新变量

javascript - 引用错误 : function is not defined