尝试将 onclick 功能添加到用 Javascript 创建的按钮答案

【问题标题】：Trying to add onclick function to a button created in Javascript尝试将 onclick 功能添加到用 Javascript 创建的按钮
【发布时间】：2022-08-18 22:11:11
【问题描述】：

我有一个通过 javascript 创建的按钮，但我无法将功能分配给按钮。

当我将其设置为未分配给任何按钮的 onclick 时，该功能起作用，因此我知道我可能格式化错误。

任何帮助表示赞赏。

JS代码

var tickButton;
for (tickButton = 0; tickButton < myNodelist.length; tickButton++) {
  var span = document.createElement(\"SPAN\");
  var txt = document.createTextNode(\"\\u2713\");
  span.className = \"tick\";
  span.appendChild(txt);

  tickButton.onclick = function(){
    alert(\'hello\');
  };

  myNodelist[tickButton].appendChild(span);
}

您的控制台中是否有任何错误？ myNodelist 是什么？这似乎并没有真正将跨度附加到文档中。

标签： javascript button onclick

【解决方案1】：

我想你可以使用这段代码：

let btn = document.createElement("button");
btn.innerHTML = "Save";
btn.onclick = function () {
  alert("Button is clicked");
};
document.body.appendChild(btn);

或者

let btn = document.createElement("button");
btn.innerHTML = "Save";
btn.addEventListener("click", function () {
  alert("Button is clicked");
});
document.body.appendChild(btn);

但我建议使用 onClick，这是一种更好的方法。另外，请注意您应该在循环中添加整个代码。因为您不能在包含按钮的变量上循环。

来源：https://sebhastian.com/javascript-create-button/

【讨论】：