Question

当我点击链接时，它工作正常，但只有ONCE。

我希望能够在addEventListener被执行后保留{。}}。

<div id=myBox>
    <a href="#" id="append">append</a>
</div>

document.getElementById("append").addEventListener("click", appendMore);
function appendMore() {
    myBox.innerHTML += '1';
}

Answer 1

您希望使用单独的元素将内容插入。

＆＃13;

document.getElementById("append").addEventListener("click", appendMore);

function appendMore() {
  tgt.innerHTML += "1";
}

＆＃13;

<div id=myBox>
  <a href="#" id="append">append</a>
  <span id="tgt"></span>
</div>

＆＃13;

Answer 2

// Parent element
var el = document.querySelector('#myBox');
// Find append and add listener
el.querySelector("#append").addEventListener("click",appendMore);

function appendMore( event ) {
    // Append new text node
    el.appendChild( document.createTextNode('1') );
}

Answer 3

使用jQuery可以轻松实现。

$('#append').click(function () {
    $('#myBox').append('1');
});

找到 JSFIDDLE

注意：如果您想使用普通的javascript实现此目的，请告诉我们。

不可阻挡的addEventListener

3 个答案: