javascript - 从单位表示（rem/vh/px/...）计算（javascript）像素的最佳方法

寻找一种简单而强大的方法来计算任何字符串的像素长度，例如：“55rem”/“33vh”/“300px”到当前浏览器的像素。

据我了解，有 window.getComputedStyle()，但我不希望将样式附加到任何实际元素。所以，考虑到我不关心计算的任何元素的百分比，只是简单的单位转换（相对于当前用户浏览器/缩放） - 应该很容易被一些伪元素合理计算？

有一些解决方案涉及单位的实际计算，但我相信为此必须有一个更简单的 3 线性解决方案（可能使用 getComputedStyle 或类似函数）......

更新：也许它不应该在 JS 中完成。或者简单地说，不是最佳实践......这也是一个答案。只是检查一下这个去/不去......

标签： javascriptpixelunit-conversion

getComputedStyle是一项非常昂贵的操作，因为每次调用它都会触发 CSS 重排。我建议手动计算转换，使用window.innerHeight或document.body.style.fontSize（如果它是内联设置的）。

如果你使用 Webpack，你甚至可以加载SCSS 变量来获取body字体大小。