dart - 在Dart中测量HTML元素的宽度和高度

我想知道一个元素的确切大小，不包括边距，边框和填充，而只是最里面的框的宽度和高度(请参见下图)。
目前，我知道函数“getBoundingClientRect”，该函数给出的大小包括边框和内边距。还有“client”属性，该属性返回包含填充的Rect。
所以问题是，如何在不填充的情况下获得宽度和高度？

最佳答案

不幸的是，DOM没有提供这种功能。这就是为什么大多数库(如jQuery，ExtJS等)都提供辅助方法的原因。他们实质上是parse the style并弄清楚了。

这是一个例子:

<div style="width: 100px; height: 100px; padding: 5px; border: 1px solid #000"></div>

int getWidth(Element element) {
  var paddingLeft = element.style.paddingLeft.replaceAll('px', ''); // You may want to deal with different units.
  var paddingRight = element.style.paddingLeft.replaceAll('px', '');

  return element.clientWidth - int.parse(paddingLeft) - int.parse(paddingRight);
}

以及用法:

print(getWidth(query('#test')));

结果:

100

笔记:

您可能考虑处理不同类型的单位(px，pt，em，...)。

box-sizing属性还具有您可能要检查的效果。

如果我或您碰巧发现时间，则可以发布Pub软件包之类的东西。 :)

关于dart - 在Dart中测量HTML元素的宽度和高度，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/15634714/