使用Javascript读取外部css

Question

所以如果有一个外部的css文件，如：

<link rel='stylesheet' type='text/css' href='test.css'>  

我们希望使用javascript阅读syle表，我们可以这样做：

document.styleSheets[0].cssRules[0].cssText; (for example for first rule)

它在firefox中运行正常，但同样的语句在chrome中出现错误，类似于Type Error: "non_object_property_load"。

可能是什么问题，我们如何阅读Chrome中的样式表？

请看一下我面临的问题：

http://s4.postimage.org/x5q0xt1vh/file.png  

编辑：当测试文件和链接的css在本地放置在系统上而不能通过网络服务器访问时，问题就出现了。

Answer 1

好的，我发现了问题。这确实是安全相关的，如果外部css在firefox的同一目录中但不适用于chrome，则可以使用 如果css文件在另一个目录或在线，它也不能在Firefox中工作。

现在要解决这个问题，我开始使用参数--allow-file-access-from-files进行chrome，现在它的工作正常。

Answer 2

http://www.quirksmode.org/dom/w3c_css.html - 看起来Chrome不支持.cssText

Answer 3

这适用于Chrome（至少14个）：

document.styleSheets[0].cssRules[0].cssText

那会给你规则。虽然这个：

document.styleSheets[0].cssRules[0].cssText[0]

将为您提供第一条规则的第一个字母。