检测DIV的高度是否发生变化

Question

使用document.getElementByID('div1').clientHeight如何检测DIV1的高度是否改变？

如果条件(Div1的高度变化)满足，我需要做一个操作。

例如。

if(document.getElementByID('div1').clientHeight != //old div1's height)
{
   // do my operation
}

谁能提供我这样的JavaScript的语法。

Answer 1

利用div的style属性。也许你的旧DIV1的高度是20px；

if(document.getElementByID('div1').style.height != 20px;)
{
   // do my operation
}

Answer 2

我会这样使用JQuery

$(elm).resize(function(event) {
    alert('resized!');
    /* ... other code ... */
});

有关详细信息，请参阅http://api.jquery.com/resize/。

独立于任何实现，您可能应该使用节流器：“调整大小处理程序中的代码永远不应依赖于处理程序被调用的次数。根据实现的不同，调整大小事件可以在调整大小的过程中连续发送(这是Internet Explorer和基于WebKit的浏览器(如Safari和Chrome)中的典型行为)，或者仅在调整大小操作结束时发送一次(这是其他一些浏览器(如Opera)中的典型行为)。”

Answer 3

document.getElementById('div1').onresize = function() {...};

在函数中放入你想要的任何代码。

我不是百分之百确定这会成功。您最好使用一个setInterval来检查offsetHeight是否已更改并相应地执行操作。