getElementsByClassName()不能添加事件监听
程序员文章站
2022-06-09 20:06:50
...
在给一个输入框添加监听事件的时候,控制台一直报错,报错原因显示
Uncaught TypeError: document.getElementsByClassName(...).addEventListener is not a function
通过查资料得知:
这是因为选择器没有正确选择元素对象
document.getElementsByClassName("tip")捕捉到的是该类名元素的数组
正确的访问方式应该是:
document.getElementsByClassName("tip")[0].addEventListener("onclick",function(){});
如果想给每个类都添加事件,可以这样写
//document.getElementsByClassName("tip");
//返回包含 class="tip" 的所有元素的一个列表,,你在列表上直接使用onlick方法肯定没有用了,需要在列表中的每个元素中使用。
var elements = document.getElementsByClassName("tip");
for(var i = 0;i < elements.length;i++){
elements[i].onclick=function(){
this.style.display="block";
};
}