未捕获的TypeError:对象#<NodeList>没有方法'addEventListener'

Lin*_*say 2 html javascript button addeventlistener

我在一个相对简单的HTML文件中有一个按钮元素.我正在尝试添加一个事件监听器,但我一直在收到错误,我不确定原因:Uncaught TypeError: Object #<NodeList> has no method 'addEventListener'

我正在尝试学习'addEventListener'方法,但我不明白我正在做什么是错的:

HTML:

<button>guess</button>

JS:

var myButton = document.getElementsByTagName('button');

myButton.addEventListener('click', doSomething, false);

var doSomething = function(e){
    console.log('I was clicked!');

    e.preventDefault();
    return false;
};
Run Code Online (Sandbox Code Playgroud)

谢谢那些帮助过的人.

对于可能遇到此问题的任何其他新手,总结如下:

  1. 当您使用document.getElementsByTagName()或返回NodeList的任何其他方法时,您必须指定要操作的节点.
  2. 确保在声明函数添加事件侦听器.

小智 8

getElementsByTagName('button')返回一个列表,而不是一个元素.您需要将EventListener添加到该列表中的第一个元素.

尝试:

var myButton = document.getElementsByTagName('button')[0];
Run Code Online (Sandbox Code Playgroud)