0

我正在使用在线教程并尝试理解下面的代码。我不明白为什么这可以工作两次以上。当循环执行了两次i == len并且条件i < len不再为真时。那么为什么可以将不同的类切换两次以上呢?

我的猜测是,当条件为假i时再次设置为0,我是否理解正确?希望有人可以帮助我,我在网上的任何地方都没有找到这个特定问题的解释。

HTML

 <button>Normal</button>
 <button>Changed</button>

CSS

.normal {background-color: white;color:black;}
.changed {background-color: black;color:white;}

JavaScript

(function() {
var buttons = document.getElementsByTagName("button");

for (var i = 0, len = buttons.length; i < len; i +=1)
  buttons[i].onclick = function() {
    var className = this.innerHTML.toLowerCase();
    document.body.className = className;
 }}
}());
4

1 回答 1

0

循环只执行for一次并遍历所有按钮。在for循环体中,您onclick为每个按钮定义一个函数。

因此,在您可以单击循环已经完成的任何位置onclick并向每个按钮添加一个函数(每次都会调用该函数)之前,您单击该按钮。

随着button[i].onclick = function() {...}您向按钮单击事件添加事件处理函数。

您应该阅读更多关于一般事件处理程序的信息。

于 2013-08-20T09:22:54.660 回答