如何獲取創建的元素（按鈕）以運行功能？

Question

這是我用來創建按鈕的代碼：

var dfom = document.createElement('div');
dfom.setAttribute("id","options");
dfom.innerHTML = "<input type=\"button\" value=\"Say HI\" onclick=\get()\ />";
dfom.style.padding = '10px';
document.body.insertBefore(dfom, document.body.firstChild);

按鈕創建良好； 它顯示正確。 因此，為了進行測試，我這樣做：

function get()
{
alert("HI");
}

但是，當我單擊按鈕時，沒有任何反應。 有什么幫助嗎？ 謝謝！

Answer 1

函數名稱也應該用引號引起來，即onClick="get();" 。 如果有時間，還請在事件偵聽器上閱讀，以了解此處的信息 。

Answer 2

如果要編寫正確的JavaScript代碼，則應按以下步驟進行操作：

var dfom = document.createElement("div"),
    button = document.createElement("input");

button.type = "button";
button.value = "Say HI";
button.addEventListener("click", function() {
    alert("HI");
}, false);

dfom.id = "options";
dfom.style.padding = "10px";
dfom.appendChild(button);

document.body.insertBefore(dfom, document.body.firstChild);

演示： http : //jsfiddle.net/TKdYh/

Answer 3

在get()周圍， \\應該是\\" ，但還有更多注意事項：實際上， get函數必須在onload或另一個回調之外定義，因為它需要全局可用。您將需要類似以下的設置：

http://jsfiddle.net/CZ2y4/

...定義了onLoad回調之外的get ，使其可用於onclick 。

另外，請使用標准事件綁定，而不要使用onclick ：

dfom.innerHTML = "<input type=\"button\" value=\"Say HI\">";
dfom.firstChild.addEventListener('click', get);

http://jsfiddle.net/CZ2y4/1/

Answer 4

以下對我有用：

window.onload = function() {
  var dfom = document.createElement('div');
  dfom.id = "options";
  dfom.innerHTML = '<input type="button" value="Say HI" onclick="get()">';
  dfom.style.padding = '10px';
  document.body.insertBefore(dfom, document.body.children[0]);
}

function get() {
  alert("HI");
}

注意事項：

1. 對於標准DOM屬性，通常最好只設置屬性，不要使用setAttribute，因為它實現不一致。

2. 在腳本中使用單引號和在makrup中使用雙引號更加清晰，這樣您就不必使用太多的反斜杠來引用引號了。

3. 嚴格來說，HTML屬性值僅在包含某些字符時才需要加引號。 只引用所有字符而不是記住那組字符是更容易的。 瀏覽器也非常寬容，因此您可以不用在某些瀏覽器中應加引號的未加引號的字符，而在其他瀏覽器中則不能。