addEventListener - div öğelerindeki değişiklikleri algılar?

Bölme elemanlarındaki değişiklikleri tespit etmek istiyorum. Zaten bazı türler ile "addEventListener" denedim (örneğin, değişim, yük). İşte addEventListener - div öğelerindeki değişiklikleri algılar?

benim örnektir ama olay tetiklemez:

<!doctype html> 
<html> 
    <head> 
    </head> 
    <body> 
     <div id='DivElement'>Test Div Text...</div> 
     <button type="button" onclick="EditDivElement()">click me!</button> 

     <script> 
      function EditDivElement() { 
       ClickCounter++; 
       SelectedDiv.textContent="new text content: " + ClickCounter; 
      } 

      function OnDivEdit() { 
       alert("success!"); 
      } 

      var ClickCounter = 0; 
      var SelectedDiv = document.querySelector("#DivElement"); 

      SelectedDiv.addEventListener("change", OnDivEdit); 
     </script> 
    </body> 
</html>

(Düzenleme:. Bu bir tarayıcı eklenti için ve o diğer web sitelerinde kullanılması gerektiğini)

kaynak

2016-04-11 Flo93atx

Değişiklikleri yapan siz olduğunuzdan, DOM değişikliklerini (mutasyonlarını) dinlemenin genellikle iyi bir fikir olmadığı için zaten sahip olduğunuz işlevlere bağlanmanız gerekir. – adeneo

Bir tarayıcı eklentisi içindir ve diğer web sitelerinde kullanılmalıdır. – Flo93atx

belki bu? http://stackoverflow.com/questions/15657686/jquery-event-detect-changes-to-the-html-text-of-a-div – Ronnie

kullanabilirsiniz MutationObserver. MDN'yi itibaren

// 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, childList: true, characterData: true }; 

// pass in the target node, as well as the observer options 
observer.observe(target, config); 

// later, you can stop observing 
observer.disconnect();

Not:

kullanımdan kaldırıldı Ya ben yazdım uzantılarında yapmış DOMNodeInserted dinlemek için oldu.

div.addEventListener("DOMNodeInserted", function (e) { 
    e.target // 
}, false);

kaynak

2016-04-11 23:50:55 BrunoLM

Teşekkür ederiz! MutationObserver harika çalışıyor. Ve kullanımdan kaldırılmış işleviniz de. – Flo93atx

addEventListener - div öğelerindeki değişiklikleri algılar?

cevap

İlgili konular