Javascript: Überprüfen, ob Element geändert wurde

Question

Ich möchte wissen, wenn es möglich ist, wie in Javascript einchecken, wenn ein Element geändert wurde oder ein Attribut davon?

Ich meine so etwas wie window.onhashchange für ein Element so etwas wie:

document.getElementById("element").onElementChange = function(); 

Wie ich weiß onchange so etwas wie das ist, aber es wird funktionieren, wenn ich auf diese Weise wissen wollen:

var element = {}; 
element.attribute = result; 

element.attribute.onchange = function(); 

Answer 1

Soweit ich verstehe Sie OnChange on Javascript Objekt Eigenschaften ändern möchten. Die Antwort ist nein, es existiert nicht soweit ich weiß.

Aber Sie können eine Set-Funktion wie diese machen (als Proof of Concept): ‚etwas von undefined zu Hallo Welt verändert‘

var element = {}; 

element.setProperty = function(property, value) { 
    if (typeof(element.onChange) === 'function') { 
    element.onChange(property, element[property], value); 
    } 

    element[property] = value; 
}; 



element.onChange = function(property, oldValue, newValue) { 
    alert(property + ' changed from ' + oldValue + ' to ' + newValue); 
}; 

element.setProperty('something', 'Hello world!'); 

jetzt erhalten Sie eine Warnung mit. Und (element.something === 'Hello World!') wird true zurückgeben.

wenn Sie jetzt anrufen:

element.setProperty('something', 'Goodbye world!'); 

Sie eine Warnung mit ‚etwas von Hallo Welt verändert bekommen! Auf Wiedersehen Welt! '.

Natürlich müssen Sie die Eigenschaft nur über die setProperty-Methode in Ihrem gesamten Code festlegen, wenn Sie dieses Ereignis erfassen möchten!

Edit:

Zu einem bestimmten Zeitpunkt in der Zukunft, könnten Sie in der Lage sein Object.observe() zu verwenden.

Edit 2:

Jetzt gibt es auch proxies.

Answer 2

Ich denke, dass Sie eine Möglichkeit benötigen, das Ereignis zu erfassen, das die Änderung des Attributs ausgelöst hat, und nicht die Änderung des Attributs. Die Änderung des Attributs kann nur entweder auf Ihr CSS oder auf Ihr JavaScript zurückzuführen sein, beides Manifestationen der Aktionen des Benutzers.

Answer 3

Ich glaube, es gibt kein solches Ereignis. Sie können setInterval oder setTimeout jedoch verwenden, um nach Elementänderungen zu suchen und sie entsprechend zu verwenden.

Answer 4

Ich habe das getan. Es funktioniert ziemlich gut. Ich hätte die Methode setProperty benutzt, wenn ich es gewusst hätte.

function searchArray(searchValue, theArray, ChangeValue){ 
    for (var i=0; i < theArray.length; i++) { 
     if (theArray[i].id === searchValue) { 
      theArray[i].changed = ChangeValue; 
     } 
    } 
} 

function getArrayIindex(elementid, theArray){ 
    for (var i=0; i < theArray.length; i++) { 
     if (theArray[i].id === elementid) { 
      return i; 
     } 
    } 
} 

function setInputEvents(hiddenObject) { 

     var element; 

     for (var i = 0; i < document.forms[0].length; i++) { 
      element = document.forms[0].elements[i]; 

      //Check to see if the element is of type input 
      if (element.type in { text: 1, password: 1, textarea: 1 }) { 

       arrFieldList.push({ 
        id: element.id, 
        changed:false, 
        index: i,      
       }); 

       element.onfocus = function() { 
        if (!arrFieldList[getArrayIindex(this.id, arrFieldList)].changed) { 
         hiddenObject.value = this.value; 
         this.value = ''; 
        } 
       } 

       element.onblur = function() { 
        if (this.value == '') { 
         this.value = hiddenObject.value; 
        } 
       } 

       element.onchange = function() { 
        searchArray(this.id, arrFieldList, true); 
       } 
      } 

     }