为什么这个javascript代码不起作用？

Question

据说这段代码不应该有效，但我不明白为什么不这样做。谢谢你的帮助。

function myFunction() {
        var intface = document.createElement("div");
    var butn = document.createElement("div");
    butn.className = "btn";
    butn.innerHTML = "Click here";

    butn.onclick = function() {
        alert("pressed");
    }
    intface.appendChild(butn);
    intface.innerHTML +=" Press here";
    document.getElementsByTagName('body')[0].appendChild(intface);
    }

Answer 1

执行innerHTML += ...时，您正在重写innerHTML，并且所有事件处理程序都将丢失。

应该是

interface.appendChild(btn);

var text = document.createTextNode(' Press here to see an alert');
interface.appendChild(text);

document.body.appendChild(interface);