getElementsByTagName in JavaScript

Question

我对纯JavaScript的语法很陌生；您知道为什么"getElementsByTagName“在我的简单测试中不起作用吗？

 var btn = document.getElementsByTagName('button');
console.log(btn);


btn.onclick=function(){
    alert('entered');
document.getElementById("demo").innerHTML="test";
}

小提琴

Answer 1

应该是

var btn = document.getElementsByTagName('button')[0];

而不是

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

getElementsByTagName返回匹配元素的数组。因此，使用0索引访问按钮。

更多关于getElementsByTagName()的信息

或

您可以提供特定的id on按钮，并可以使用getElementById()

JS

var btn = document.getElementById('myButton');

   <button id="myButton">....</button>

Answer 2

getElementsByTagName返回一个数组，而不是一个元素。您需要循环查看结果，并分别为每个结果附加一个函数，如下所示：

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

for( var x=0; x < buttons.length; x++ ) {

   buttons[x].onclick = function(){

       alert('entered');
       document.getElementById("demo").innerHTML="test";
   };
}

Answer 3

用btn代替btn就像这样-

   btn[0].onclick=function(){
     alert('entered');
     document.getElementById("demo").innerHTML="test"; 
   }