`$(文档).on(“click”，"a"`与`$("a").click(`

Question

谁能告诉我这两个脚本有什么不同，我不是javascript/jquery专家。

$(document).on("click", "a", function () {
    i = $(this).data("value");
    alert(i)
})

$("a").click(function () {
    i = $(this).data("value");
    alert(i)
});

Answer 1

$(document).on("click", "a", function () {将在绑定事件时不存在的a元素上绑定事件。这被称为。

事件委派允许我们将单个事件侦听器附加到父元素，该侦听器将为与选择器匹配的所有后代触发，无论这些后代现在存在还是将来添加。

而$("a").click(function () {将只将事件绑定到DOM中存在的a元素。

Answer 2

第一个给出了event delegation，即它将事件与DOM中存在的元素绑定，并满足选择条件+任何在事件绑定(满足选择器条件)后添加到DOM中的元素将在动态添加到DOM时自动绑定。

而后者将事件与现有元素绑定在一起。

Delegated events

委托事件的优点在于，它们可以处理稍后添加到文档中的后代元素中的事件。通过选择在附加委托事件处理程序时保证存在的元素，可以使用委托事件来避免频繁附加和移除事件处理程序。

Answer 3

第一个将检查文档上的每一次点击，并检查它是否来自"a“标签，如果是，则执行代码，这也与动态创建的"a”标签相关。

第二个将只为页面上已经存在的"a“元素执行代码。