javascript - jquery 如何观察特定选择器在 dom 中的任何变化

Question

我有一个函数可以在网页上查找类 .dirty 的存在和计数。它必须从某个点开始，但在那个点上，我希望 jQuery 观察 DOM 中的 css 更改并重新运行此函数。这可能吗？我可以为此使用 on() 吗？喜欢:

$(document).on('change','.dirty', dosomething);

尽管我知道这与更改的用途不同。基本上，我想要的更改是“dirty”的任何 addClass 或 removeClass。

示例标记

寻找观察在“顶级菜单”上添加/删除 .dirty 以便我可以传播更改

<div class="top-level-menu dirty" data-menu-global-id="12828">
  <input id="menu-name-global-id-12828" size="30" type="text" value="Some value here">
</div>

Answer 1

.on 非常适合此功能，但我会尝试更具体地说明您期望“.dirty”发生的位置。例如，如果你知道 dirty 只会发生在 nav 中，那么只看 nav。

$('nav').on('change', '.dirty', function(e) {
    doSomething(e); 
});

查看jsFiddle .