javascript - 获取(可能未应用的)CSS 属性的值

Question

我有以下 CSS

.EggChart {
    width: 5000px;
    height: 400px;
}

并且想要读取 height 的值来自 CSS 类规范，使用原始 JavaScript 或 jQuery。如果该类已应用于 DOM 的元素，这似乎很简单:我会选择具有该类的 DOM 元素并读取它们的 CSS 属性，但如果该类尚未应用于任何 DOM 元素 我该怎么做？

Answer 1

对于具有固定常量值的简单 CSS 属性(例如上面给出的属性)，您可以创建一个虚拟元素，然后获取您要查找的属性的计算值。

使用普通 JavaScript:

var el = document.createElement('div');
el.className = 'EggChart';
console.log(window.getComputedStyle(el).getPropertyValue('height'));

使用 jQuery:

console.log($('<div class="EggChart"></div>').css('height'));