Erkenne die Änderung des Elementstils in Chrome

7

Ich versuche einen Weg zu finden, Änderungen am Elementstil zu erkennen, aber ich hatte nicht viel Glück. Der folgende Code arbeitet an einer neuen Eigenschaft, die ich wie tempBgColor definiere, aber ich kann eine vorhandene Eigenschaft wie die Farbe nicht überschreiben / überschatten. Ich weiß, dass jquery eine Überwachungsfunktion hat, aber es erkennt nur Änderungen von der jquery-API, aber ändert nicht direkt den Wert eines Stils wie elem.style.color.

%Vor%

Irgendwelche Zeiger?

    
webber 26.11.2012, 13:56
quelle

3 Antworten

15

Sie können dies mit einem MutationObserver tun - siehe demo (nur Webkit), das ist die neue, glänzende Möglichkeit, über Änderungen im DOM benachrichtigt zu werden. Der ältere, jetzt veraltete Weg war Mutationsereignisse .

Demo meldet sich einfach an der Konsole an, wenn der Absatz angeklickt wird. Beachten Sie, dass der alte Wert nicht verfügbar ist, wenn er über eine nicht inline CSS-Regel festgelegt wurde, die Änderung jedoch weiterhin erkannt wird.

HTML

%Vor%

JavaScript

%Vor%

Kredit an diesen Blogpost , für einige der oben genannten Code.

    
andyb 26.11.2012, 14:28
quelle
5

Wenn die Chrome-Entwicklertools geöffnet sind, können Sie das Element finden, dessen Änderung Sie interessiert. Klicken Sie mit der rechten Maustaste darauf, wählen Sie "Abbrechen" und "Attributänderungen".

    
Stubbs 15.06.2015 21:59
quelle
1

Hier ist eine naive Implementierung mit setTimeout mit undescorejs.

Die einzige Möglichkeit herauszufinden, welche Änderung vorgenommen wurde, besteht darin, die Eigenschaften des Stilobjekts zu durchlaufen.

Hier ist das Beispiel

%Vor%     
AlexandruSerban 26.11.2012 15:14
quelle

Tags und Links