Javascript MutationObserver未检测到其他表行

我试图使用MutationObserver检查表中添加的新行，下面的代码似乎适用于H2元素，但是当我将其更改为表行时，console.log不会输出到控制台，如果我检查表，则会添加TR。有人有什么想法吗？我不明白为什么它不能观察到表行被添加

var list = document.getElementById("testtable");

var MutationObserver = window.MutationObserver ||
    window.WebKitMutationObserver || 
    window.MozMutationObserver;

var observer = new MutationObserver(function(mutations) {  
    mutations.forEach(function(mutation) {
        if (mutation.type === 'childList') {
           console.log("mutation!");
        }
    });
});

observer.observe(list, {
    attributes: true, 
    childList: true, 
    characterData: true 
});

var element = ("tr");


setInterval(
    function(){ 
        $(list).append("<h2>" + "THIS IS A TEST" + "</h2>");
        //This doesn't work
        //$(list).append("<tr>" + "<td>" + "<h2>" + "THIS IS A TEST" + "</h2>" + "</td>" + "</tr>");
    }, 
    2000);

var list=document.getElementById（“testtable”）；
var MutationObserver=window.MutationObserver||
window.webkittionobserver | |
window.mozionobserver；
var observer=新的突变观察者（函数（突变）{
突变。forEach（功能（突变）{
if（mutation.type==='childList'）{
log（“变异！”）；
}
});
});
观察者，观察者{
属性：正确，
儿童名单：是的，
characterData：true
});
var元素=（“tr”）；
设定间隔(
函数（）{
$（list.append（“+”这是一个测试“+”）；
//这不管用
//$（list.append（“+”+“+”）这是一个测试“+”+”）；
}, 
2000);

---

这里有一个可行的方法：

您需要将

子树

选项设置为true

observer.observe(list, {
    attributes: true,
    childList: true,
    characterData: true,
    subtree: true
});

添加

tr

时，它不会直接添加到

表

中，而是添加到

tbody

元素中，因此实际上会修改观察到的元素的子树。要观察子树中的任何更改，您需要在配置中设置

subtree:true

演示：