JavaScript第二个循环不会改变CSS

Question

我正在使用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'; }

Answer 1

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

将evenRows[evenRows.length]更改为i <= evenRows.length;，这很有效。

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