jq 实时监听元素样式变化
时间: 2023-07-03 18:05:14 浏览: 180
你可以使用 jQuery 的 `MutationObserver` 来监听元素的样式变化。这个 API 可以跟踪 DOM 树的变化,包括元素的属性变化、子节点的增减等等。下面是一个示例代码:
```javascript
// 监听元素样式变化的函数
function watchStyleChanges(selector, callback) {
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
callback(mutation.target);
}
});
});
$(selector).each(function() {
observer.observe(this, { attributes: true });
});
}
// 监听元素 #my-element 的样式变化
watchStyleChanges('#my-element', function(element) {
console.log('Element style changed:', element);
});
```
这个代码会在 `#my-element` 元素的样式发生变化时打印一条消息。你可以根据自己的需要修改这个函数。
阅读全文