javascript - 如何使用 YUI3 检测 HTML 元素的样式变化？

Question

我正在使用的网站使用的是不稳定的广告提供商，有时他们返回的 JS 代码有问题，例如最终改变了整个 body 元素的背景颜色，而不是它自己的 div 元素。不幸的是，我们必须使用他们的服务，他们需要很长时间才能纠正这些错误。

所以，我正在考虑创建一个解决方法，例如当 body 元素的 background-color 样式更改时，我的回调函数将被调用以将其更改回正确的值。有没有一种干净的方法可以使用 YUI3(或者 jQuery，或者如果 YUI3 没有它，则使用纯 JS)？

我知道我可以使用 setInterval() 定期设置背景以校正颜色，但对我来说这看起来既浪费又困惑。谁知道更好的方法？

Answer 1

如果您通过 javascript 更改 CSS，您可以使用 Mutation Events (二级事件)。

你可以监听那些事件:

• 已修改 DOMAttr
• DOMAttributeNameChanged
• DOMCharacterDataModified
• DOMElementNameChanged
• DOMNodeInserted
• DOMNodeInsertedIntoDocument
• DOMNodeRemoved
• DOMNodeRemovedFromDocument
• DOMSubtreeModified

因此，要么使用 Style 属性或 Class 属性监听 DOMAttrModified。