jQueryを使用した動的要素の確認

Question

jQueryを使用して、動的に挿入された要素を検出するにはどうすればよいですか？このような何か：

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

それは時にDOMが最初にロードされたときに存在していなかった要素、アヤックスを使用して挿入しても要素をトリガーできるようにする必要があります。

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>