html - 如何用javascript判斷div是否發生了溢出

Question

網頁上有一個p（id="info"）元素，它的寬度和高度是固定的，css如下：

p#info 
{
    width: 10cm;
    height: 8cm;
    border-style: solid;
    border-width: 1pt;
    border-color: orange;
    overflow: auto;
}

它裡麵包含若干個p（或其它的區塊級元素）這些是透過AJAX動態取得的，所以也不知道高度是多少,如果過多或過大都會導致info的溢出。所以info的overflow樣式設定為了auto，這樣在內容溢出的時候就會出現捲軸。

我的問題是：

能否用javascript判斷這個info是否發生了溢出？

或者這樣也可以：用javascript判斷info是否已經出現了捲軸？

（解釋一下這樣做的目的，AJAX會不停的從伺服器拉取訊息，但每次得到的條目長短可能有很大差異，所以不知道顯示到第幾條時info會溢出。如果info溢出了，程式就會適當刪除舊的條目，否則就會繼續在info裡堆積）

Answer 1

可以用元素的scrollHeight属性和clientHeight属性来判断, 当scrollHeight大于clientHeight的时候，元素就是可以垂直滚动的；如果检测水平滚动的话，可以用scrollWidth和clientWidth

var element = document.getElementById('element');
if (element.scrollHeight > element.clientHeight) {
    ...
}

關於scrollHeight和clientHeight可以看看MDN的介紹:
scrollHeight

clientHeight