parentNode是空与MutationObserver.observe（document.body的

Question

我想跟踪一些特殊的标签，UI组件，例如<颜色>，<日期>，因此建立和插入到DOM元素等的时候，我可以把它转换成。真正的功能HTML块

这里的代码，观察addedNodes上document.body的

function handleAddedNodes(nodes) { 

    [].forEach.call(nodes, function(node) { 

     if (!node.tagName) 
      return; 

     //how is it possible, node.parentNode is null????? 
     if (!node.parentNode) { 
      return; 
     } 
    }); 
} 

var observer = new MutationObserver(function(mutations) { 

    mutations.forEach(function(mutation) { 

     handleAddedNodes(mutation.addedNodes); 
    }); 
}); 

observer.observe(document.body, { 
    childList : true, 
    subtree : true 
}); 

预期它工作正常，但我也发现了一个奇怪的问题：没有parentNode一些addedNodes（如“观察（ document.body“表示addedNodes应该是document.body的后代，对吧？）

整个函数作为一个大型前端项目的插件，我不知道项目如何改变DOM，设置innerHTML或appendChild（这里的代码太多）。它也不能被调试，因为观察函数是异步的，如事件，没有函数调用堆栈。

所以我只想知道什么可能会导致这个问题，并且 更好，如果它可以用jsFiddle 复制。

好，似乎jsFiddle可以重现此，

Answer 1

如果添加的元素，然后立即删除一个MutationObserver的看着元（比下setImmediate快被触发），观察者会请注意并为addedNode和removedNode添加一个mutation - 但正如您已经注意到所引用的元素没有父节点。

已更新，例如 See fiddle

有了您MutationObserver从运算下面的代码将调用三次handleAddedNodes，一旦对于附加在该删除的元素的元素的元素多数民众赞成被移除并且一次。被移除的元素将没有父项，而第二个元素将有父项。

var body = document.body; 
var test = document.createElement("div"); 
var test2 = document.createElement("span"); 
body.appendChild(test);//adds childList mutation (addedNodes) 
test.appendChild(test2);//adds subtree mutation (addedNodes) 
body.removeChild(test);//adds mutation (removedNodes)