jquery.initialize

作者注释 (pie6k)。几年前我创建了这个库，当时它很棒。现在你可能不应该使用 jQuery 来做类似的事情，而应该使用 React 或类似的东西。谢谢。 — 2018-11-21

错误报告仍然被接受。

jQuery.初始化

创建jQuery.initialize插件是为了帮助维护页面上动态创建的元素。

概要

jQuery.initialize 将迭代与选择器匹配的每个元素并应用回调函数。然后，它将侦听文档对象模型的任何更改，并将回调函数应用于插入到与原始选择器匹配的文档中的任何新元素。

 $.initialize([selector], [callback]);

这允许开发人员定义一个初始化回调，每当与选择器匹配的新元素插入到 DOM 中时就会应用该回调。它也适用于通过 AJAX 加载的元素。

简单演示 - 单击此处

使用示例

 $.initialize(".some-element", function() {
    $(this).css("color", "blue");
});

但现在如果页面上出现与.some-element选择器匹配的新元素，它将立即初始化。添加新项目的方式并不重要，您不需要关心任何回调等。

 $("<div/>").addClass("some-element").appendTo("body"); //new element will have blue color!

不观察

要停止对文档的观察，您可以通过在返回的MutationObserver实例上调用disconnect()来断开观察者的连接，这将阻止观察者接收进一步的通知，直到再次调用observe()为止。 。例如，

 var obs = $.initialize([selector], [callback]); // Returns MutationObserver
obs.disconnect();

选项

target

默认情况下，会观察整个文档的更改。这可能会导致性能不佳。可以通过指定目标来观察 DOM 中的特定节点：

 $.initialize(".some-element", function() {
    $(this).css("color", "blue");
}, { target: document.getElementById('observe-this-element') });

否则，目标将默认为document.documentElement 。

observer

可以提供自定义MutationObserverInit 。如果没有提供，它将默认为内部配置。

浏览器兼容性

插件基于MutationObserver 。它适用于 IE9+（请阅读下面的注释）和所有现代浏览器。

注意：要使其在 IE9 和 IE10 上运行，您需要添加 MutationObserver polyfill - 就像这里的那样：https://github.com/webcomponents/webcomponentsjs

---

性能测试（感谢@bezborodow和@liuhongbo ）

托多

• 使其兼容bower和npm ，添加高级性能测试。

贡献者

• 亚当·彼得拉西亚克
• 达米安·别兹博罗多夫
• 迈克尔·赫尔斯