javascript - 确定文档中不存在的某些 DOM 元素的实际渲染高度的最快方法

Question

我需要创建一些 DOM 元素并计算它们的实际渲染高度。我编写了一些代码来首先创建所有它们并将它们插入到文档中，然后使用 getBoundingClientRect 方法计算它们的高度。但是元素的数量很大，这个过程的时间对于我的应用来说太长了。有没有更快的方法来做到这一点？

// first create all element -> list
// insert all of them to document
console.time("for");
for(var i = 0; i < length; i++) {
    heights[i] = list[i].getBoundingClientRect().height;
}
console.timeEnd("for");

Answer 1

您正在获取元素的大小，如果您只想要高度，您可以尝试这些，我不知道它们是否更快。

document.getElementById('myDiv').clientHeight;
document.getElementById('myDiv').offsetHeight;

clientHeight包括填充。 offsetHeight包括 padding、border 和 scrollBar