jQuery:标识DOM已更改

Question

编辑:根据Matt的建议更改.ready()调用。

我使用jQuery配置一些东西，如下所示：

$(function ()
{
     $('.myThing').each(function() {

         ... configure it ...

     });
});

我的问题是在调用.ready()之后，新元素被添加到DOM中。不会对这些元素执行配置。

对于像绑定单击事件这样的简单事情，.live()可以完成任务。但是对于更复杂的东西，我还没有找到一个好的解决方案。

当DOM改变的时候有一个事件吗？或者更具体地说，当向DOM添加新元素时？

编辑:使用livequery的试探性解决方案似乎是：

$(function ()
{
    $.fn.configureIt = function()
    {
        ... configure it ...
    }
});
$('.myThing').livequery(function () {
    $(this).configureIt ()
});

再次编辑: livequery被证明不是解决方案。它经常在DOM中搜索添加或删除的元素。在一台速度相当快的计算机上，运行一个中等的页面，这是可以的。在速度很慢的计算机上，页面非常大，有几个livequeries和IE6，每隔几秒就会有半秒的延迟，而且页面加载的延迟更长。

我们得出的结论是，制定共同的“共同行为”迎合了我们的懒惰。由于我们的团队有一些普通的JavaScript人员，以及一些几乎没有JavaScript人员和JavaScript专家，我们希望定义HTML标记的约定，而不是在每个新页面上都接触到这些行为。事实证明，考虑到我们当时对JavaScript的了解，这是不可能的。

我们提出的解决方案是，每当我们使用AJAX或动态内容创建更改DOM时，我们都会发生一个事件：

$('.stuff').load(loadUrl, postData, function() {
    $(this).trigger('contentLoaded');
    // among other stuff
});

然后，对于任何小部件类型的事情，我们都依赖于这个约定。

$('*').live('contentLoaded', function() {
    $('.myThing', this).configureIt();
});

这并不理想。单独的页面创建者需要知道当他们在页面中做事情时触发自定义事件的约定(诚然封装在一些共享的实用函数中)，并且小部件创建者需要依赖使用这种约定的页面创建者，但最终这并不是什么大问题，因为我们是一个封闭的团队，并且不向外部发布我们的应用程序。

Answer 1

我使用livequery插件就是为了这个目的。它对我来说是有效的，但如果在你的情况下不是这样，你至少可以从源代码中了解它是如何工作的。

Answer 2

您已经提到过探索.live()方法，但是您可能还希望考虑使用.delegate()。我仍在审查该应用程序接口，以寻找更适合的应用程序接口--但也许它可以满足.live()的不足之处。