jquery - 使用 jQuery 检查动态元素

Question

使用 jQuery，如何检测动态插入的元素？像这样的事情:

$('div#cart').on('mutate', function() {
    // Do something.
});

它需要能够在 DOM 最初加载时不存在的元素(甚至是使用 Ajax 插入的元素)时触发。

Answer 1

有一个名为 DOMSubtreeModified 的事件，该事件用于观察子树的更改。我不确定它是否可以在 Internet Explorer 或其他浏览器中工作，但我确信它可以在最新版本的 Chrome 和 Firefox 上工作。

类似这样的事情:

$(function () {
  $("#dom").on("DOMSubtreeModified", function () {
    console.log("DOM content changed.");
  });
  setTimeout(function () {
    $("#dom").text("Hello, World!");
  }, 1000);
  $("button").click(function () {
    $("#dom").text("Button Change");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="dom">Hello</div>
<button>Change Text</button>