在dom中插入新节点时是否会触发jquery事件？

当dom元素插入到dom中时，是否存在jquery对其激发的事件

例如，假设我通过ajax加载一些内容并将其添加到DOM中，在其他javascript片段中，我可以使用.live（）添加一个事件，这样当匹配特定选择器的事件添加到DOM中时，该事件就会触发所述元素。类似于$（document）.ready（），但基于动态添加到DOM的内容

我梦想的是：

$('.myClass').live('ready', function() {
    alert('.myClass added to dom');
});

如果jquery不支持这样的功能，那么有没有其他方法可以在不修改实际执行初始dom操作的代码的情况下实现此功能？

仍然满足这一特殊需求，如下所示：

$('.myClass').livequery(function() {
  alert('.myClass added to dom');
});

$('body').on('DOMNodeInserted', '#common-parent', function(e) {
  if ($(e.target).attr('class') === 'myClass') {
    console.log('hit');
  }
});

如果像上面那样只传递一个回调函数，它将为它找到的每个新元素运行，包括最初的元素和添加的元素。在函数

中，此

指的是刚刚添加的元素

---

侦听冒泡的事件，因此不适合这种“添加元素时”的情况，在这方面，（插件）并没有完全被添加到core所取代，只有事件冒泡部分（大多数情况下）被替换。

没有jQuery事件，但有一个DOM事件：domnodeinsertedintocument。您可以使用jQuery的on方法监听DOM事件。因此：

$('.myClass').on('DOMNodeInsertedIntoDocument', function() {
  alert('myClass was inserted into the DOM');
}

---

这可能比使用liveQuery更好，因为该插件有点过时（2年以上没有更新，只承诺支持jQuery 1.2.x）。

如果您生活在最前沿，可以使用MutationObserver:）

var MutationObserver=window.MutationObserver | | window.webkit MutationObserver | window.MozMutationObserver；
var list=document.querySelector（'ol'）；
var observer=新的突变观察者（函数（突变）{
突变。forEach（功能（突变）{
if（mutation.type==='childList'）{
var list_values=[].slice.call（list.children）
.map（函数（节点）{return node.innerHTML；}）
.过滤器（功能）{
如果（s=='
'）{
返回false；
}
否则{
返回true；
}
});
console.log（列出值）；
}
});
});
观察者，观察者{
属性：正确，
儿童名单：是的，
characterData：true
});

见：

编辑：这个答案很古老，现在除了Opera Mini之外，所有浏览器都支持MutationObserver：

此外，以下是MDN上API的直接链接：

已弃用：根据@Meglio下面的评论，

DOMNodeInserted

事件已弃用，并将在将来某个未知时间从web上删除。为了获得最佳效果，请开始学习

见@dain的答案

如果直接将绑定到文档或正文，则每次在任何位置插入任何内容时都会执行该绑定。如果希望回调仅在添加特定类型的元素时运行，那么明智的做法是使用

通常，如果将一类元素添加到DOM中，则将它们添加到公共父级。因此，像这样附加事件处理程序：

$('.myClass').livequery(function() {
  alert('.myClass added to dom');
});

$('body').on('DOMNodeInserted', '#common-parent', function(e) {
  if ($(e.target).attr('class') === 'myClass') {
    console.log('hit');
  }
});

基本上与的答案相同，但由于您使用的是委托事件处理程序而不是直接事件处理程序，因此其中的代码触发频率会降低

注:

---

这似乎也行。。。但我不知道为什么。

看一看。这是一个有趣的库，它使用CSS来检测新元素。因为它使用CSS，所以不会对性能造成影响，并且会返回与选择器匹配的实际元素。

Hello，为此，需要在另一段Javascript中触发插入<代码>$（“”）.appendTo（document.body.trigger（“就绪”）如果在将jQuery UI小部件添加到DOM的同时将其附加到内容，则只需收听

[widget]create

事件。（请参阅；注意小部件事件前缀。）对于那些好奇livequery如何工作的人来说，没有setTimeout或任何愚蠢的东西；livequery只是“代理”浏览器的DOM操作方法，实际上这很愚蠢，因为它只会短路jQuery DOM操作方法，以便在调用它们时执行一些代码。如果DOM在没有使用jQuery方法的情况下被更新，它将无法工作。插件似乎已经死了。对于现在看到这个的人，请看一看。有趣的库，使用CSS来检测新元素。我无法以任何方式让它工作。。。关于如何使其工作的任何见解？这不起作用，因为您在将事件处理程序插入dom之前将其附加到元素，因此选择器可能返回空的元素集。另一种方法是使用委托，例如--**$（document.body）.on（'domnodeinsertedintocument'，'.myClass'，function（）{alert（'myClass已插入DOM'）；}**--但这也不起作用，因为domnodeinsertedintocument不会冒泡。这看起来是最好的答案。我通过定位文档来实现它。例如：

$（document）.on（'DOMNodeInserted'，function（e）{if（$（e.target）.children（“：first”）.attr（'class'）=='lpchatterlink'）{changeMessage（）；})

这确实是一个循环。没有对上面的内容进行太多的测试。我想说，这肯定是现代浏览器的最佳答案，但支持的范围仅限于IE9，因此仍然需要回退。已弃用：此功能已从Web上删除。尽管某些浏览器可能仍然支持它，但它正在被删除ing已被删除。不要在旧项目或新项目中使用它。使用它的网页或Web应用程序可能随时中断。--请改用MutationObservers:@Meglio工作是“如果可能，改用MutationObservers”。（重点添加）。另请参见：这太简单和实用了，我们必须立即反对它！…有时我讨厌网络。这是解决问题的一种非常聪明的方法。Star