JS的onclick在Chrome和Safari中均不能被触发

写了一段很简单的源码,就是最基本的使用 <button> 触发事件:
HTML 源码如下:

<body>
    <button>Click this button to trigger an event</button>
</body>

<script src="Event.js"></script>

JS 源码如下:

var btn = document.getElementsByTagName("button")
btn.onclick = function () {
    alert("Successfully Triggered an Event !");
    console.log("Good");
}

在浏览器中解析后,调试时发现 btn 中选择到了 <button> 元素,而且也被赋值了。但是点击 <button> 按钮却没有反应,即没有出现 alert 对话框,控制台也没有显示 “Good”。请问各位大佬这是为什么啊 ?

阅读 2.7k
1 个回答

因为getElementsByTagName获取的是元素集合,不是元素本身,所以你需要先从这个集合中取到元素,再进行绑定

var btns = document.getElementsByTagName("button")
// 或者使用遍历,需要注意它是一个为数组,不能直接当数组进行遍历 
btns[0].onclick = function () {
    alert("Successfully Triggered an Event !");
    console.log("Good");
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏