我是这里的新手(也是JavaScript的新手),所以请原谅我的基本问题。
我有一个包含不同图像的HTML页面,这些图像都共享一个类。通过使用getElementsByClassName,我得到了一个数组。我想通过使用.map()函数将事件侦听器添加到数组中的每个单元格。

这就是我所拥有的:

window.onload = function(){
var allImgs = document.getElementsByClassName("pft");

var newImgs = allImgs.map(
        function(arrayCell){
            return arrayCell.addEventListener("mouseover, functionName");
        }
    );
};

即使我将内部函数更改为不包含事件侦听器的内容,这仍然显示错误“allImgs.map不是函数”。

我有此代码的另一个版本,我在其中循环遍历window.onload中的数组单元,并以这种方式将事件侦听器添加到每个单元中,并且它可以正常工作。
.map()函数为什么不起作用?它不能在window.onload中使用吗?

最佳答案

getElementsByClassName()返回HTMLCollection而不是Array。您必须先将其转换为JavaScript数组:

allImgs = Array.prototype.slice.call(allImgs);
// or
allImgs = [].slice.call(allImgs);
// or
allImgs = Array.from(allImgs);

09-25 18:02