Javascript 将事件从GetElementsByCassName分配给元素

Javascript:

var myArr = document.getElementsByClassName('contItm');

for(i=0;i<myArr.length;i++){
    myArr[i].onmouseover = function(){
        document.getElementById(myArr[i].id + 'Mnu').style.display = "inline";
    }
}

var myArr=document.getElementsByClassName（'contItm'）；
对于（i=0；i您在循环中遇到了一个著名的“i”问题，当调用该方法时，它将等于myArr.length。下面是解决该问题的一种方法

var myArr = document.getElementsByClassName('contItm');

for(i=0;i<myArr.length;i++){
    (function (elem) {
        elem.onmouseover = function(){
            document.getElementById(elem.id + 'Mnu').style.display = "inline";
        };
    })(myArr[i]);
}

循环中著名的“i”有一个问题，当调用该方法时，它将等于myArr.length

var myArr = document.getElementsByClassName('contItm');

for(i=0;i<myArr.length;i++){
    (function (elem) {
        elem.onmouseover = function(){
            document.getElementById(elem.id + 'Mnu').style.display = "inline";
        };
    })(myArr[i]);
}

将事件绑定到父元素：

HTML：

<ul id="contMnu" class="contMnu"> ... </ul>

使用
e.target
获取鼠标悬停的元素并在那里执行逻辑

将事件绑定到父元素：

HTML：

<ul id="contMnu" class="contMnu"> ... </ul>

使用
e.target
获取鼠标悬停的元素并在那里执行逻辑


<ul id="contMnu" class="contMnu"> ... </ul>

var menu = document.getElementById("contMnu");

menu.onmouseover = function(e){
    console.log(e.target);
};