jquery - 使用 jQuery（或纯 JS）添加新的 DOM 元素

Question

明确一点：我不是在问如何将现有的钩子放到新的 DOM 元素上。我知道 live() 函数和旧的 livequery 插件。我在问别的东西。

我想知道的是如何挂钩新 DOM 元素的创建。我问的原因是我正在创建一个无法控制第一方脚本的第三方用户 JS 脚本。这些第一方脚本（经过混淆处理）通过添加新的 DOM 元素定期更新页面。我想在添加这些元素后执行代码。

使用 $( '...' ).bind( 'ajaxSuccess', function() ..... ) 适用于一些添加，但不是全部。

Answer 1

如果它们总是使用 document.createElement 方法添加，您可以简单地替换它并在那里进行跟踪。

document.replacedCreateElement = document.createElement;
document.createElement = function(tagName) {
    this.replacedCreateElement(tagName);
    //do your tracking  
}

Answer 2

我不知道你为什么问你是否知道livequery。Livequery将允许您连接到任意新的 DOM 元素。除此之外，我唯一知道要做的就是挂钩 DOM 方法（例如 appendChild 等......）

集成到 jQuery 中的 live() 函数实际上并不是完整的 livequery 实现。（Resig 认为在不增加代码大小的情况下集成太多功能）

在 live() 中，缺少的是以下类型函数：

$('*').livequery(function() {
 // do something
});

使用它，它应该会捕获任何添加。

Answer 3

好吧，我选择了这对，它似乎在 20 秒或更短的时间内触发了所需的 DOM 更新：

$( '#someid' ).bind( 'ajaxSuccess', function() { ... } );
$( '#someid' ).ajaxSuccess( function( e, r, s ) { ... } );

我宁愿不必依靠 livequery 来减慢页面加载速度，并且 replaceCreateElement 解决方案会破坏 CPU。