使用纯JS计算布局

Question

我是否有一个对象代表具有样式的页面元素：

Repeat step 3&4.

如何通过这些算法http://taligarsiel.com/Projects/howbrowserswork1.htm#layout计算这些元素位置的坐标和大小而不使用浏览器的DOM？所以我看到的结果类似于：

[{
   id: "widget-1",
   display: "block",
   float: "left",
   width: 100
}, {
   id: "widget-2",
   display: "block",
   float: "right",
   width: 200
}]

这是否有图书馆？我需要在浏览器中快速计算这个，所以javascript实现会很有用。

我看到我们有https://github.com/facebook/css-layout，但只支持＆＃34; flex-box＆＃34;布局。

Answer 1

它是“quiet simple”，但你想从头开始构建CSS Box Model。即使系列中的this entry point也可能会有所帮助