javascript - 如何获取渲染的 HTML 页面的大小而不是其客户端大小？

Question

我需要获取 HTML 页面上元素占用的大小。
不是浏览器的客户端宽度。
由于我无法强制 html 将所有内容都包含在 div 中，因为它是用户提供的，所以我需要知道该大小。
我试图获取主体元素的大小，但无法获取。 (尝试了 .width 和 style.width 但都不起作用)

Answer 1

除非您明确知道要测量哪些内容元素，并且您知道它们不是像 div 那样的弹性内容元素，无论实际内容如何，​​都可以全宽，否则您无法执行此操作。

如果您确实知道要测量哪些元素，则可以迭代所有元素以获得它们的大小和位置，并累积一个边界矩形，该矩形是所有有趣元素的并集。但是，如果这是您不知道的任意 HTML(如您所描述的)，您就无法知道您关心的内容与只是全宽的任意容器之间的区别，因为它自然会这样做。

例如，查看包含 div 中的自动换行文本。包含的 div 为全宽，因此它始终为全宽。包含 div 的高度可以测量，但宽度始终为全宽，并且高度仅适合该特定宽度。改变宽度，高度就会不同。