Question

我有这个代码在IE上完成工作。它显示了与HTML文档关联的样式表的数量，以及每个样式表中的CSS规则的数量，以及每个规则的背景颜色（如果没有定义，则显示白色）。

然而，它没有以正确的方式使用chrome！为什么??

有人有解决方案吗？我非常感谢你的帮助。

HTML文件

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<link href="CSS/estilos.css" rel="stylesheet" type="text/css">

<style type="text/css">
body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    background-color: #EEE;
}

</style>
<script>

function show_styles() {

      var theSheets =[]
      theSheets = document.styleSheets;
      alert("Number of stylesheets: " + theSheets.length);

      for (var k=theSheets.length-1; k>=0; k--){
          var aSheet = theSheets[k];

          var theRules =  aSheet.cssRules; 
          if (!theRules)
         theRules = aSheet.rules;

          var totalRulesInStylesheet = theRules.length;
          alert("Index of stylesheet: " + k + ":: Number of rules on this stylesheet: " + theRules.length);

          for (var i = 0; i <totalRulesInStylesheet; i++) {
         var  fundo ="rgb(255,255,255)";

         alert("Rule number: " + i);

         var aRule =  theRules[i];

         if (aRule.style.backgroundColor !='')
            fundo = aRule.style.backgroundColor;

            var fundo2 = fundo.replace(/[^\d,]/g, '').split(',');    // (r, g, b) ->> [r g b]

            alert("Background-color of the style  >" +  aRule.selectorText +  ": " + fundo2);

       } // total rules
    } // total stylesheets

} 


</script>

</head>

<body>
<script language="javascript">
show_styles();
</script>
</body>
</html>

CSS文件（estilos.css）：

.gerberas {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: small;
    line-height: 18px;
    background-color: #F0861C;
}
.tulipas {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: small;
    line-height: 18px;
    background-color: #A4BF33;
}

.camelias {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: small;
    line-height: 18px;
}
.rosas {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: small;
    line-height: 18px;
    background-color: #F318BD;
}

脚本在IE中工作，但不在Chrome中

0 个答案: