从ownerNode(样式标签)获取样式表对象

Question

我在我的网页上有多个style标签，我想操纵其中的cssRules。我如何从样式元素中获得styleSheet作为document.styleSheets对象。一种方法可以是扫描document.styleSheets中的所有styleSheets，并将其ownerNode与我的style元素对象匹配。还有比这更好的办法吗?

Answer 1

Per http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-style-element，样式元素实现了LinkStyle接口，通过引用可以指向http://dev.w3.org/csswg/cssom/#the-linkstyle-interface，这表明您可以访问每个样式元素的sheet属性(与<link rel="stylesheet">一样)—只要它们是默认的text/css。从那里，您可以获得您正在寻找的更专业的CSSStyleSheet接口(即具有cssRules的接口)。

<style>
  p {color:blue;}
</style>
<script>
  var h = document.getElementsByTagName('style')[0];
  alert(h.sheet.cssRules[0].cssText); // "p { color: blue; }"
</script>