检测选择的所有选项何时更改

Question

有没有办法检测选择中所有选项的属性何时发生变化？ 例如

<select id="languages">
    <option value="en">English<option>
    <option value="fr">French<option>
    <option value="de">German<option>
    ...
</select>

并且第三方插件会添加（第一次）或更改（第二次+时间）lang属性，所以它会变成：

<select id="languages">
    <option value="en" lang="fr">Anglais<option>
    <option value="fr" lang="fr">Français<option>
    <option value="de" lang="fr">Allemand<option>
    ...
</select>

所以我想观察/检测所有选项的属性何时发生变化，这样我就可以调用我的函数。我认为mutationobserver 可以，但我无法让它发挥作用。

Answer 1

我只是想通了，如果将来有人需要它：

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

var observerConfig = { 
    attributes: true,
    attributeFilter: ['lang'],
    subtree: true
};

var target = document.querySelector('.languages');

observer.observe(target, observerConfig);