如何通过样式表中定义的Javascript读出CSS文本？

Question

我在考虑使用Javascript功能来自动变换CSS3属性像border-radius,transform,box-shadow等他们的浏览器特定的同行.

我做了一些研究,发现你可以迭代通过定义的样式表document.styleSheets.您可以通过以下方式找到CSS规则document.styleSheets[0].cssRules[0].cssText.

我想修改包含CSS3通过与相应的供应商前缀注入浏览器的特定属性,如属性的CSS规则-webkit-border-radius,moz-border-radius等等.

但是,似乎cssText在每个浏览器中对属性进行了预处理,以过滤掉它不理解的CSS属性.这实际上打破了这个想法.

问题:有没有办法完全按样式表中的定义检索CSS文本？或者:有没有其他方法可以通过Javascript实现这一目标？我想维护干净的CSS文件,而不需要为每个特定的浏览器多次定义每个属性.

Answer 1

你为什么不创建每个浏览器都有独特的预备CSS3对应物的样式表呢？如您所述,每个浏览器都会过滤掉他们无法识别的属性.如果你有这不要紧-webkit-border-radius,并moz-border-radius与border-radius所有相同的CSS选择器同时放定义.如果浏览器识别出其中一个,它将被使用,如果没有,它将被丢弃.即使浏览器识别出多个版本,它们也很可能具有相同的值,因此无关紧要.