JavaScript如何给HTML元素动态绑定onclick和hover事件（） _绑定hover事件

JavaScript如何给HTML元素动态绑定onclick和hover事件？
JavaScript使用getElementsByClassName获取所有指定类名的HTML元素，然后使用for循环遍历逐个添加事件，这里要注意每个元素的事件是否存在共享数据的情况，普通添加事件的情形所有元素都会共享一个数据，若需要各自使用不同的数据，这时则需要使用闭包传值，达到每个元素都使用不同数据的目的。
【JavaScript如何给HTML元素动态绑定onclick和hover事件（）】1、动态绑定onclick事件：

var items = document.getElementsByClassName("item"); // 动态绑定onclick事件 // 使用for循环遍历，注意要使用立即执行函数和闭包才能生效 for(var i = 0; i < items.length; i++){ (function(j){ items[j].onclick = function(){ console.log("click: " + j); } })(i); }

2、动态添加hover事件：

// 动态绑定hover事件 for(var i = 0; i < items.length; i++){ (function(j){ items[j].onmouseover = function(){ this.style.color = "#ffe573"; }; items[j].onmouseout = function(){ this.style.color = "#fff"; }; })(i); }

效果如下：