javascript - JavaScript第二循环不会更改CSS

我正在使用GreaseMonkey重新着色特定网站的某些元素。但是，使用下面的循环时，只有第一个循环会进行任何更改。更改循环的顺序将仅允许第一个循环生效。

var i;
var evenRows = document.getElementsByClassName("even");
for (i=0;i<=evenRows.length;i++) { evenRows[i].style.backgroundColor = '#555'; }

var oddRows = document.getElementsByClassName("odd");
for (i=0;i<=oddRows.length;i++) { oddRows[i].style.backgroundColor = '#333'; }

var theLinks = document.getElementsByTagName("a");
for (i=0;i<=theLinks.length;i++)  { theLinks[i].style.color = '#aaa'; }

最佳答案

问题出在您的循环逻辑上，该逻辑引发JS错误。该数组的索引为0，但是length属性的索引为1。在循环中，您正在查看计数器是否小于或等于数组的长度，这意味着当i等于evenRows.length时，循环仍将运行。您无法访问evenRows[evenRows.length]，因为它不存在。

将i <= evenRows.length;更改为i < evenRows.length;，效果很好。

JS小提琴：http://jsfiddle.net/grammar/vdwxua7s/1/