javascript - 单击后创建带有功能的按钮

Question

我有一些功能...

function myFunction()
{
    var btn = "<input type='button' onclick='sf();'>";
    var t = document.createTextNode("FINISH GAME");
    btn.appendChild(t);
    document.body.appendChild(btn);
};
function sf(){window.alert("You finished the game!")};

..以及一个激活第一个功能的按钮。

<button onclick="myFunction()">Click Me!</button>

因此，当我单击“Click Me”按钮时，应创建另一个按钮，并带有文本“FINISH GAME”。单击第二个按钮时，会显示文字“您完成了游戏!”应该引起警惕。 但是点击第一个按钮，什么也没有发生。编码错误在哪里？我哪里忘了逗号？ ;)

Answer 1

您正在以错误的方式创建输入元素。

function myFunction()
{
    var btn = document.createElement('input');
    btn.setAttribute('type' , 'button');
    btn.setAttribute('value', 'FINISH GAME');
    document.body.appendChild(btn);
    btn.addEventListener('click','sf',false);

 };
function sf(){window.alert("You finished the game!")};

how to create element in JavaScript