mutation-observers

问题 I recently came across this awesome MutationObserver feature which sort of keep tracks of the changes on any dom element. I used the code that was shown on the mozilla developer network, but can't seem to make it run. This is the code I used (link): // create an observer instance var target = document.querySelector('#something'); console.log(target); var observer = new WebKitMutationObserver(function(mutations) { mutations.forEach(function(mutation) { console.log("Success"); //$('#log').text(

问题 If a mutation observer is added by some JS is it possible for other JS to detect, remove, replace or change that observer? My concern is that if some JS aims to corrupt some DOM element without being discovered that JS may want to get rid of any observers watching that DOM element. 回答1: I'm not sure about detecting whether an observer is already installed, but they can be effectively deleted by re-observing the nodes of interest using an empty function. Re-observing a node will replace the

问题 It's not the problem to make MutationObserver work for #someID , but what's the way to make it work for .someClass ? Currently I'm using the following: // this example doensn't work, // as well as many another attempts var target = document.querySelectorAll(".someClass"); for (var i = 0; i < target.length; i++) { // create an observer instance var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { var foo = target[i].getAttribute("someAttribute") if

问题 It's not the problem to make MutationObserver work for #someID , but what's the way to make it work for .someClass ? Currently I'm using the following: // this example doensn't work, // as well as many another attempts var target = document.querySelectorAll(".someClass"); for (var i = 0; i < target.length; i++) { // create an observer instance var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { var foo = target[i].getAttribute("someAttribute") if

问题 I try to add a MutationObserver in my web page to track changes in an image src , but that doesn't work. Here's the code used: setTimeout(function() { document.getElementById("img").src = "http://i.stack.imgur.com/aQsv7.jpg" }, 2000); var target = document.querySelector('#img'); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { console.log(mutation.type); }); }); var config = { attributes: true, childList: false, characterData: false }; observer

问题 I have a angularjs component, HTML template <div id="panel" class="hide-div"> <div id="viewPort" class="hide-div"> ... </div> </div> JS var myController = function() { var ctrl=this; ctrl.$onchanges = function() { } var source = $("#viewport"); var target = $("#panel"); var observer = new MutationObserver(function() { target.toggleClass("hide-div", source.hasClass("hide-div")); }); observer.observe($("#viewport")[0], {attributes: true}); } var config = { controller: [myController],

问题 I have the following structure: <div class="wrapper"> <div class="col">left</div> <div class="col">middle</div> <div class="col">right</div> </div> Now I want to get the nodes ONLY if INSIDE $('.col') a div of class "block" is included like: YES for THIS: $('.col')[1].append($('<div class="block">urgent</div>')); but NO for THIS: $('.col')[1].append($('<div class="different">dontcare</div>')); my Observer looks like this: var observer = new MutationObserver(function (mutations) { mutations

问题 I have a select[multiple] which I have given a class custom-multiselect on my page for which I am catching the DOMSubtreeModified event as follows: HTML: <select class="custom-multiselect"></select> JQuery: $('.custom-multiselect').each(function (i, select) { var sel = this; adjustHeight(sel); //Custom function //Binding DOMSubtreeModified to catch if the select list gets modified by the user $(sel).on('DOMSubtreeModified', function () { adjustHeight(sel); }); //For Internet Explorer $(sel)

问题 I'm writing a simple userscript that will auto-hide a Facebook post if it contains a certain list of words. The core functionality works, but my MutationObserver doesn't seem to read the className of mutation.addedNodes properly. I loop through mutation.addedNodes and check if any of those elements have the class userContentWrapper , but the result of that test is always false -- even if the element does have the class. var startObserver = function() { var observer = new MutationObserver

问题 I would like to use a MutationObserver object to observe changes to some of my DOM nodes. The docs give an example of creating a MutationObserver object and registering it on a target. // select the target node var target = document.querySelector('#some-id'); // create an observer instance var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { console.log(mutation.type); }); }); // configuration of the observer: var config = { attributes: true,