有没有一种方法可以在CSS文件内部执行JavaScript？

Question

我只能访问一个CSS文件并对其进行修改。我有很多修改要做，想知道是否有一种方法可以从CSS文件内部执行JavaScript代码。

我发现了一个旧漏洞，但这个漏洞在最新的浏览器中已不再受支持。 http://dougrathbone.com/blog/2013/10/30/executing-javascript-inside-css-another-reason-to-whitelist-and-encode-user-input 正如您所看到的那样，这个漏洞是通过从另一个URL调用任意代码来利用的。

body {
    behavior:url(/user/uploadedfiles/evil-uploaded-component.htc);
    }

现在，我想知道是否有其他的方法来实现这个？

- Mohamed Kamel Bouzekria

---

这个应该对你有所帮助：在CSS中使用JavaScript - Zenoo

CSS和Javascript文件不会混合太多...尝试使用脚本标签直接将js文件添加到HTML中，并将src指向JS文件。 - Vinod kumar G

可能是在CSS中使用JavaScript的重复问题。 - delinear

可能是将JavaScript放入CSS中的重复问题。 - Horkrine

Answer 1

IE和Firefox都包含了执行CSS中JavaScript的方法。正如Paolo提到的，IE中一种方式是使用表达式技术，但也有更为晦涩的HTC行为，其中通过CSS加载包含脚本的单独XML。类似的技术在Firefox中也存在，使用XBL。这些技术并不直接从CSS中执行JavaScript，但效果相同。

使用IE的HTC

使用如下CSS规则：

body {
  behavior:url(script.htc);
}

在那个script.htc文件中，需要有如下内容：

<PUBLIC:COMPONENT TAGNAME="xss">
   <PUBLIC:ATTACH EVENT="ondocumentready" ONEVENT="main()" LITERALCONTENT="false"/>
</PUBLIC:COMPONENT>
<SCRIPT>
   function main() 
   {
     alert("HTC script executed.");
   }
</SCRIPT>

HTC文件在事件ondocumentready（指HTC文档的准备就绪）上执行main()函数。

使用Firefox的XBL

Firefox支持类似的XML脚本执行方法，使用XBL。

可以使用以下CSS规则：

body {
  -moz-binding: url(script.xml#mycode);
}

同时在您的script.xml文件中：

<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl" xmlns:html="http://www.w3.org/1999/xhtml">

<binding id="mycode">
  <implementation>
    <constructor>
      alert("XBL script executed.");
    </constructor>
  </implementation>
</binding>

</bindings>

构造函数标签内所有代码都会被执行（建议将代码包装在CDATA部分中）。

在这两种技术中，只有当CSS选择器匹配文档中的元素时，代码才会执行。通过使用类似于 body 的内容，它将立即在页面加载时执行。

- Mohamed Kamel Bouzekria