javascript - 如何返回由外部样式表类应用于元素的所有 CSS 属性(不获取计算样式!)？

Question

给定的 css 类:

.red {
    color: rgb(255,0,0);
   background-color: rgb(0, 255, 0);
}

然后我通过以下方式向 dom 添加一个 div:

$("<div></div>").addClass("red").hide().appendTo("body");

我可以使用以下方式获取单个属性:

$(".red").css("color");

返回 rgb(255, 0, 0);

我的问题是如何在不直接使用属性名称的情况下遍历 css 类属性并将它们全部返回？

Answer 1

我实际上已经找到了一个使用这个非常方便的 jQuery 库的解决方案:https://github.com/f0r4y312/jquery-stylesheet

我现在可以遍历每个样式表和声明并返回:

var key is a loop through the css property names
$.stylesheet("." + key + "").rules()[0].style

然后返回所有样式属性:

0 "color" "rgb(255, 0, 0)"
1 "background-color" "rgb(0, 255, 0)"
etc

我现在正在将其序列化为 json 数组以进行单元测试!

感谢您所有非常有帮助的回复!