在调试 HTML 时，有没有办法使用 JavaScript 或 jQuery 来监听 div 宽度变化？

Question

在调试 HTML 时，有没有办法使用 JavaScript 或 jQuery 来监听 div 宽度变化？ 由于一些 CSS 我有一个 div 改变大小，并且无法弄清楚在哪里，甚至步入。 我想知道是否有办法将事件连接到 div 以查看导致它发生变化的原因？ 即使可能，我也不确定如何首先传递堆栈信息以了解导致大小变化的原因，所以这甚至可能是不可能的。

Answer 1

我使用 Chrome，它似乎提供了最多的细节。

• 下载铬
• 按 f12
• 转到第一个选项卡 [元素]
• 单击放大镜和 go 到您的 div
• 右键单击突出显示的 html 和 select “中断子树修改”

Answer 2

这是不好的方式，但我不确定这样的事件是否存在。

$(function(){
    var last = $("#your_div").width();
    setInterval(function(){
        if (last != $("#your_div").width()){
            alert('div width changed');
        }
    }, 100);
});

Answer 3

这个人解释了如何附加到 DOMAttrModified 事件以检测 CSS 更改。

使用 Jquery 更改 css 属性时的事件检测

它仅在 FF 和 Opera 中受支持，但如果它只是用于调试，它就可以解决问题。

http://www.quirksmode.org/dom/events/

Answer 4

FireFox 的 Firebug 允许您在 CSS 上附加和断开，并且属性更改是您正在寻找的吗？