如何引用数组中的当前dom元素以通过侦听器更改活动

Question

目前，我正在循环我的所有图像，并使用for循环使它们的onmouseover/onmouseout事件改变它们的图像。

 var arrows = document.getElementsByClassName('arrow');

 for (var i = 0; i < arrows.length; i++) {
     arrows[i].onmouseover = arrows[i] + ".src = 'images/downarrow_hover.gif';";
     arrows[i].onmouseout = arrows[i] + ".src = 'images/downarrow.gif';";
 }

它不工作，我这样做对吗？

Answer 1

您必须将函数分配给onmouseover和onmouseout。

var arrows = document.getElementsByClassName('arrow');

for (var i = 0; i < arrows.length; i++) {
    arrows[i].onmouseover = function () {
        this.src = 'images/downarrow_hover.gif';
    };

    arrows[i].onmouseover = function () {
        this.src = 'images/downarrow.gif';
    };

无论它是否值得，如果你负担得起，你应该研究一下，它让a such thing变得轻而易举

$('.arrow').hover(
    function () { $(this).attr('src', 'images/downarrow_hover.gif'); },
    function () { $(this).attr('src', 'images/downarrow.gif'); });