JSFiddle - React, Tailwind, and code Playground

by dfsq

HTML

<img src="http://lorempixel.com/100/100/nature/3" id="image" />

<button id="btn-src">Change src</button>
<button id="btn-title">Add title</button>

JavaScript

var target = document.querySelector('#image');

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

observer.observe(target, {
    attributes: true,
    attributeOldValue: true
});



// Testing
document.getElementById('btn-src').addEventListener('click', function() {
    document.getElementById('image').src = 'http://lorempixel.com/200/200/nature/2';
}, false);

document.getElementById('btn-title').addEventListener('click', function() {
    document.getElementById('image').title = Math.random();
}, false);