函数在追加li子代后停止工作是因为在追加子代后,新添加的li元素没有绑定相应的事件处理程序。要解决这个问题,可以通过以下步骤:
下面是一个示例代码来解决这个问题:
HTML:
<button id="add-btn">追加li子代</button>
<ul id="list">
<li>第一个li子代</li>
<li>第二个li子代</li>
<li>第三个li子代</li>
</ul>
JavaScript:
// 获取按钮和ul元素
var addButton = document.getElementById("add-btn");
var list = document.getElementById("list");
// 绑定按钮点击事件处理程序
addButton.addEventListener("click", function() {
// 创建新的li元素
var newLi = document.createElement("li");
newLi.textContent = "新添加的li子代";
// 将新的li元素追加到ul中
list.appendChild(newLi);
// 绑定新添加的li元素的事件处理程序
newLi.addEventListener("click", function() {
console.log("点击了新添加的li子代");
});
});
在上面的代码中,通过addEventListener方法为按钮添加了一个点击事件处理程序。当按钮被点击时,会创建一个新的li元素,并将其追加到ul中。同时,为新添加的li元素也绑定了一个点击事件处理程序。这样无论是原来存在的li元素还是新添加的li元素,点击时都会输出相应的消息。
领取专属 10元无门槛券
手把手带您无忧上云