Javascript DOM更改如何通知引导？

如果添加了一些

data-*=“xzy”

属性（以交互方式），许多引导插件就会立即工作

例如，只需将

data toggle=“collapse”

添加到锚定标记并显示，请参见演示

我想知道：

• 背后的技术是什么？（据我所知，他们不监听突变事件，也不使用

  MutationObserver

  ）
• 我能自己用吗；-）

---

更新：我不想要。我最初希望在动态创建新元素时更新！ 但引导方式更简单，向后兼容：仅在发生某些用户交互（例如，侦听所有单击事件）时通知。

TL；DR

它使用jQuery

.on（）

函数根据

[data-*]

选择器附加到任何元素

代码示例

如果您查看源代码（可在其网站上获得）

在

boostrap.js:1468

文件中，您有以下代码块：

$(document).on(Event$3.CLICK_DATA_API, Selector$3.DATA_TOGGLE, function (event) {
  // preventDefault only for <a> elements (which change the URL) not inside the collapsible element
  if (event.currentTarget.tagName === 'A') {
    event.preventDefault();
  }

  var $trigger = $(this);
  var selector = Util.getSelectorFromElement(this);
  var selectors = [].slice.call(document.querySelectorAll(selector));
  $(selectors).each(function () {
    var $target = $(this);
    var data = $target.data(DATA_KEY$3);
    var config = data ? 'toggle' : $trigger.data();

    Collapse._jQueryInterface.call($target, config);
  });
});

$（文档）。在（事件$3.上单击\u数据\u API，选择器$3.数据\u切换，函数（事件）{
//preventDefault仅适用于
它基本上是观察文档上的click元素，并通过属性选择器和jQuery进行过滤

是这样的

jQuery(document).on('click', '[data-toggle="collapse"]', doTheToggleMagic) 

这意味着，每次单击文档都会发生反应，但前提是单击事件的源是一个属性为data toggle、值为collapse的元素

因此，要回答标题中的问题：Wordpress根本不会收到DOM更改的通知。因为它不需要通知。它只会在用户交互时做出反应。
准确地说。OP可以看到选择器用于具有
[data toggle=“collapse”]
属性，这是引导程序将选择器绑定到元素的地方—只需查看上的源代码即可github@AlonEitan抱歉，我确实查找了源代码，但没有找到正确的行。（当时我不知道如何查找单击事件。）看答案。基本思路是听所有点击
document
，然后看
target
元素是什么。@Isma你知道
$（document）的事件名称吗。on（？）
被调用？可能是@Marcel的重复，我想是on（“点击”…看看这个问题：谢谢，非常感谢。@VladNeacsu的答案很好。但是你的答案最符合我的需要！