从输入（键入“按钮”）更改为按钮标记不起作用

Question

我在看Stackoverflow上的this question。被接受的答案附有一个小提琴。我试图通过将按钮“type”更改为按钮标签来调整代码，并提出了这个小提琴。但我不知道为什么这不起作用。任何人都可以指出我要去哪里吗？

原始小提琴：https://jsfiddle.net/hQKy9/

HTML

<div id="container"></div> 
<input type="button" onclick="addDiv();" value="Click here to add div"/> 

脚本

function addDiv() { 
    var objTo = document.getElementById('container'); 
    var divtest = document.createElement("div"); 
    divtest.innerHTML = "new div"; 
    objTo.appendChild(divtest); 
} 

我的版本：https://jsfiddle.net/Miraj50/gdjpbewx/1/

HTML

<button class="but">hello</button> 
<div id="container"></div> 

脚本

var adddiv = document.querySelector('.but'); 
adddiv.addEventListener('click',addDiv); 

function addDiv() { 
    var objTo = document.getElementById('container'); 
    var divtest = document.createElement("div"); 
    divtest.innerHTML = "new div"; 
    objTo.appendChild(divtest); 
} 

Answer 1

总结你的代码在window.onload，像这样：

这将使项目加载，在这之后，你可以绑定你事件。

window.onload = function() { 

var adddiv = document.querySelector('.but'); 
adddiv.addEventListener('click',addDiv); 

function addDiv() { 
     var objTo = document.getElementById('container'); 
     var divtest = document.createElement("div"); 
     divtest.innerHTML = "new div"; 
     objTo.appendChild(divtest); 
} 

}