时间戳

首页 > 解决方案 > 是否可以通过 chrome 扩展来观察网站 DOM 上的类变化？

javascript - 是否可以通过 chrome 扩展来观察网站 DOM 上的类变化？

问题描述

当外部网站中的特定类发生变化时，我试图触发一个动作。那可能吗？

标签： javascriptgoogle-chrome-extension

解决方案

将 MutationObserver 附加到元素并观察属性更改。当发生突变时，检查attributeName突变是否为class：

const div = document.querySelector('div');

new MutationObserver((mutations) => {
  if (mutations[0].attributeName === 'class') {
    console.log('class change seen');
  }
})
  .observe(div, { attributes: true });

setTimeout(() => {
  div.classList.add('foo');
}, 2000);
<div></div>

推荐阅读