Können Sie Stiländerungen in Elementen mithilfe von JavaScript erkennen?

Stiländerungen mit MutationObserver abhören

Frage:
Ist es möglich, Stiländerungen in einem zu überwachen? Element mithilfe eines Ereignis-Listeners in JavaScript? Könnten Sie beispielsweise mithilfe von jQuery erkennen, wenn sich die Abmessungen eines Elements ändern?

Antwort:

Ja, MutationObserver ist eine moderne Browser-API, mit der Sie Änderungen in einem Element beobachten können Die Attribute des Elements, einschließlich seiner Stil.

Implementierung:

var observer = new MutationObserver(function(mutations) {
    mutations.forEach(function(mutationRecord) {
        console.log('style changed!');
    });    
});

var target = document.getElementById('myId');
observer.observe(target, { attributes : true, attributeFilter : ['style'] });

Beispiel:

$('p').bind('style', function(e) {
    console.log( $(this).attr('style') );
});

$('p').width(100);
$('p').css('color','red');

Dies wird ausgegeben Folgendes:

width: 100px;
color: red;

Unterstützung:

MutationObserver wird in modernen Browsern, einschließlich IE 11, weitgehend unterstützt.

Das obige ist der detaillierte Inhalt vonKönnen Sie Stiländerungen in Elementen mithilfe von JavaScript erkennen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!