Question

假设我们有一个包含按钮的只读网站

<div class="with-a-class">
    <div property="value">
        <table>
            <tbody><tr>
                <td>
                    <button>
                        <img src="static/first.gif">
                    </button>
                </td>
                <!-- Some more table cells-->
            </tr>
        </tbody></table>
    </div>
</div>

我想检测按钮的src属性是否有任何变化，并在每次更改时打印出来:(伪代码）

onSrcChanged: console.log(src)

我正在使用Firefox。

Answer 1

您可以使用MutationObserver来检测src中的更改

// This is your image
var target = document.querySelector('#myImage');

// This is the observer
var observer = new MutationObserver(function(mutations)
{
    // Loop all changes
    mutations.forEach(function(mutation)
    {
        // Only if src was changed
        if(mutation.attributeName=='src')
        {
            // Print the new value
            console.log(mutation.target.src);
        }
    });    
});

// Read only changes in the attributes
var config = { attributes: true, childList: false, characterData: false };

// Initialize the Observer
observer.observe(target, config);

检测外国网站中的参数更改

1 个答案: