Question

我想使用鼠标悬停事件将每个<p>的innerText更改为*。

HTML

<p id="object1">O</p>
<p id="object2">O</p>
<p id="object3">O</p>

我写了一个脚本，但它只影响了最后一个<p>。我的剧本有什么问题？我很感激你的帮助。

的JavaScript

var nodeList = document.getElementsByTagName('p');

for (var i = 0; i < nodeList.length; i++) {
    var obj = Utility.$(nodeList[i].id);
    obj.addEventListener('mouseover', function () {
        obj.innerHTML = '*';
    }, false);
}

Answer 1

您应该在事件处理程序中使用event参数，否则obj是最后一个assignent（在循环中分配）。

您不需要任何Utility帮助

var nodeList = document.getElementsByTagName('p');

for(var i = 0; i < nodeList.length; i++)
{ 
    var obj = nodeList[i];
    obj.addEventListener('mouseover', function(e){
        e.target.innerHTML = '*';
    }, false);
}

http://jsfiddle.net/002efeht/

在for循环中添加事件

1 个答案: