Javascript – Dynamische Elemente zur Seite hinzufügen

Question

Lassen Sie mich eine Frage stellen: Warum kann das p-Element nur einmal eingefügt werden und kann dann nicht erneut eingefügt werden? Änderung: Lassen Sie mich den Code posten. Dies ist js {Code...}. Ich kann den Kommentar nur einmal aktualisieren, und dann weiß ich nicht, warum. Danke: Ich wusste nicht, dass innerHTML so magisch ist, warum sollte ich mir die Mühe machen ...

仅有的幸福 · Answer

代码运行没有问题，建议检查下代码，debug一下

运行结果：

补充回答贴代码之后的问题：
观察一下你自己的代码，你用的是oRemark.innerHTML,第一次点击执行是没有问题的，因为dom是存在的，所以可以执行这个方法，然后你再次点击，表面上dom只是新增了“插入文字”，因为使用的是innerHTML，所以相当于把这个dom移除了然后在添加到页面上，所以就失去了之前的onclick事件。
下图是可以修改的一种方案：你也可以使用事件委托去完成

巴扎黑 · Answer

box应该是个包含p的盒子吧，你的box是定值，要每次更新box的

漂亮男人 · Answer

因为你修改

里面的内容的时候新添加的按钮没有添加过点击事件的。就是这个时候添加点击事件的代码没有再次执行给你添加事件，你需要把添加事件的代码放到单独一个函数里，但页面加载的时候调用一遍。然后在替换

里面的内容之后再调用一遍，这样才能把点击事件给新添加的所有按钮生效。

话说回来还是浏览器里面js的运行原理和dom，你根据我说的重新写试试。

我觉得你的代码里面第一个按钮能正常添加，其他新添加的按钮无效。试试看。

PHP中文网 · Answer

https://jsfiddle.net/8ghrx7os/

应该是可以多次插入的，楼主把代码写贴全一点看看

--------------------分割线--------------------
因为这个按钮在

的子节点。
点击按钮时更新

的同时，刷新了 button，导致监听失效。

可以重新赋值解决，或者直接把 button 放在外面。

重新赋值:

var oSubmit=document.querySelector('.remark .input-submit');
var oWrite=document.querySelector('.remark .input-write');
var arr=[];

var add = function() {
    var value=oWrite.value;
    var time=new Date().toLocaleString();
    var ele=''+
        '
'+
        ''+
        'BOSS: '+
        ''+value+''+
        ''+
        ''+time+'回复|赞'+
        '';
    oRemark.innerHTML+=ele;
    console.log(1);
    
    /* 重新赋值 */
    var oSubmit=document.querySelector('.remark .input-submit');
    oSubmit.onclick=add;
}

oSubmit.onclick=add;

为情所困 · Answer

你可以试下用jquery的方式试试看看。

//html

    
//js
$(".btn").on("click", function() {
        var p = "插入的文字";
        $(".box").append(p);
    });