Javascript Eventlistener for Update / Change on Element / innerText

addeventlistener, event-listener, javascript, onchange

Solution

Check out the MutationObserver. Using it you can listen to changes of the observed element's `characterData`. Example:

HTML

<span class="observable" contenteditable="true">12345</span>

JS

var observables = document.querySelector('.observable');

var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    console.log(mutation);
  });    
});

var config = {characterData: true, subtree: true};
observer.observe(observables, config);

FIDDLE

Note that `subtree` has to be `true` because the text actually is a child element of the observed element.

Problem

Is there a eventListener who is just checking the changes of an innerText? Example: 12345 I just want to check if "12345" is changing to something else like "23415". There is no "click" event that will comes up or anything else. I don't have the chance to go through the code where the updates from the span's are coming. So I really can just only grab the event from the changes in the span element but I don't have any clue how. Sorry for my bad English and thanks!

Original source

Related problems