2017-09-25 57 views
0

我在看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); 
} 
+1

在小提琴中,將負載類型更改爲「onDomready」。 –

+1

始終爲

+0

如果您只是將輸入內容更改爲按鈕,以下是它的外觀:https://jsfiddle.net/hQKy9/815/ – Nisarg

回答

2

總結你的代碼在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); 
} 

} 
+0

哦!謝謝,之前沒有遇到過這個功能。 – Miraj50

+0

也感謝@Nisarg Shah告訴我更多的方法來做到這一點! – Miraj50

+0

很高興我能幫到你。 –