Question

初学者JS在这里，希望有人能向我解释这一点。

1）为什么这不起作用：

var allSpans = document.getElementsByTagName('span');
allSpans.onclick = function() {
 alert('hoo'); 
};

2）或者如果我从数组中的跨度中获得所有innerHTML，我试试这个：

var allSpans = document.getElementsByTagName('span');
var arrayNumbers = [];

for (var i = 0; i < allSpans.length; i++) {
  var operator = allSpans[i].innerHTML; 
}
arrayNumbers.onclick = function() {
 alert('hoo'); 
};

Answer 1

onclick是 HTMLElementNode 对象的属性。 getElementsByTagName返回 NodeList 。将属性分配给 NodeList 不会将其分配给该列表的每个成员。
完全相同，除了您正在处理数组而不是 NodeList 。

Answer 2

您必须遍历返回的列表

var allSpans = document.getElementsByTagName('span');

for ( var i = 0; i < allSpans.length; i += 1 ) {
    allSpans[i].onclick = function (event) {
         alert('hoo'); 
    };
}

Answer 3

要回答您的第一个问题，您必须在每个节点上添加此项而不是nodeList，这是您在致电document.getElementsByTagName时获得的。你在寻找的是：

for(var i = 0; i < allSpans.length; i++){
  allSpans[i].onClick = function(){
    alert('hoo');
  };
}

在第二个问题中你遇到了类似的问题，除非它看起来好像你实际上在arrayNumbers数组中添加任何内容，所以即使你循环使用它，你也不会得到期待点击事件。

关于onclick功能的困惑

3 个答案: