Javascript 从HTML读取css文件时抛出错误

我需要读取以下代码并将其附加到div标记中（我需要实现这一点）

当我运行代码片段时，我得到

没有规则定义错误

。如果样式嵌入在同一个html文件中，则可以通过代码获取属性。但是html中引用的外部文件无法被代码识别。原因可能是什么

在这种情况下，警报返回null

编辑：

---

令我惊讶的是，同样的代码在Mozilla中运行良好，但在chrome中显示cssrules null。

一个文档中有多个样式表。所以你必须循环所有的样式表

下面是工作示例

更新1 添加了ajax以获得与页面链接的外部css

var style=“\n”；
对于（var s=0；s
.box{
位置：绝对位置；
背景色：红色；
高度：10px；
宽度：10px；
}
#汽车，
.汽车{
位置：绝对位置；
背景色：红色；
高度：11px；
宽度：10px；
}
}

创建一个演示来重现这个问题。您能告诉我您想要重现这个问题的更多信息吗？内部循环没有意义。您已经在
classes
Innerloop中有了规则，而outer用于多个css文件。请看我添加了Nvd3作为外部css示例的fiddle。JSFIDLE在chrome中提供了带有css属性值的警报。您正在使用哪个浏览器？发布的代码和我的代码之间有什么区别？请注意，如果我在html中添加样式，它就可以正常工作。我想从外部css文件中读取它。请参阅我的提琴。在您的代码中，您总是使用样式表[0]。在本例中，第0个样式表可能没有cssRules。点击我的答案中给出的“运行代码片段”按钮。它应该打印应答器中定义的css，因为您在同一页面中定义了样式，所以您的代码正在工作。我想引用一个外部css。这是我的问题，页面中是否包含外部样式表？
var totalCss= "\n";
    var requiredSheets = ['test.css']; 
    var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
    for (var s = 0; s <= classes.length; s++) {
        var cssRules = document.styleSheets[s].cssRules ||
                document.styleSheets[s].rules || []; 
        for (var c = 0; c < cssRules.length; c++) {
            totalCss+= (cssRules[c].cssText + '\n');
        }
    }

.test triangle {

    stroke: #000;
    stroke-opacity: .75;
    shape-rendering: crispEdges;
}

.test square {
    stroke-opacity: .75;
}

.test circle {
    stroke-opacity: 0;
}

.test .line {
    fill: none; 

}