在纯 JS 中重新创建 jQuery live/on

Recreating jQuery live/on in pure JS

本文关键字：jQuery live on 创建 JS 新创建 在纯      更新时间：2023-09-26

我正在用纯JS制作一个待办事项列表Web应用程序（尽量不使用jQuery！），我在一个方面挣扎，将点击处理程序附加到我刚刚创建的元素上。这是创建代码：

new_li = document.createElement('li');
new_li.innerHTML = item.value;
new_li.setAttribute('rel', time);
prependElement(tudu_list, new_li);

这发生在单击按钮时。

我需要将点击处理程序附加到 UL 中的每个 LI 上。但是当我单击新创建的 LI 时没有任何反应。我猜这是一个没有绑定到元素的点击处理程序的问题。在jQuery中，我通常会做.live（），但在JS中，我不知道如何解决这个问题！

将事件处理程序附加到<ul>元素，然后检查事件的target属性 - 如果它是<li>元素之一，则执行事件处理程序，否则跳过它。

https://developer.mozilla.org/en/DOM/event.target

一种方法是：

function clickHandler(){
    // Do something...
}
new_li = document.createElement('li');
new_li.innerHTML = item.value;
new_li.setAttribute('rel', time);
new_li.onclick = clickHandler; // <===========
prependElement(tudu_list, new_li);

当然，您可以（并且应该）使用addEventListener而不是内联脚本：

new_li.addEventListener('click', clickHandler)
相关文章：