小编And*_*rew的帖子

我想跟踪一些特殊的标签作为UI组件,例如<color>,<date>,所以当创建这样的元素并将其插入DOM时,我可以将它转换为真正的功能html块.

这是代码,在document.body上观察addedNodes.

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(因为"observe(document.body"表示addedNodes应该是document.body的后代,对吧？)

整个函数作为大前端项目的插件,我不知道项目如何改变DOM,设置innerHTML或appendChild(这里的代码太多).它也无法调试,因为observe函数是异步的,就像事件一样,没有函数调用堆栈.

所以我只想知道是什么原因造成这种情况,如果能用jsFiddle再现它会更好.

好吧,似乎jsFiddle可以重现这个,