Question

我想知道对DOM做了哪些更改，并且我想知道非常具体的信息。我想知道哪个元素是由id，类改变的，或者如果没有id或class，我想知道我在哪里可以找到这个元素。我试图用变异观察者来完成这个。这是jsfiddle以及当前代码：

<div id="divTarget">
<p>Hello World</p>
</div>

<button id="btnUpdate">Update target</button>


var fnCallback = function (mutations) {
mutations.forEach(function (mutation) {
    alert(mutation.type, "added: " + mutation.addedNodes.length + "  nodes");
    alert(mutation.type, "removed: " + mutation.removedNodes.length + " nodes");
});
};

var observer = new MutationObserver(fnCallback),
    elTarget = document.querySelector("#divTarget"),
    objConfig = {
        childList: true,
        subtree : true,
        attributes: true, 
        characterData : true,
        attributeFilter : ['style', 'id'],
        attributeOldValue : true
    };

 observer.observe(elTarget, objConfig);







//below here is just the test code    
var btnUpdate = document.querySelector("#btnUpdate"),
fnHandler = function () {
    elTarget.innerHTML = "<h2>New content</h2>";
};

btnUpdate.addEventListener("click", fnHandler, false);

有了变异观察者，有没有办法让我获得一个已改变的元素或孩子的id或类？

0 个答案: