我是这里的新手(也是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);