如何用javascript判断div是否发生了溢出

Question

网页上有一个div（id="info"）元素，它的宽和高是固定的，css如下：div#info {    width: 10cm;    height: 8cm;    border-style: solid;    border-width: 1pt;    border-color: orange;    overflow: auto;}它里面包含若干个div（或其它的块级元素）这些是通过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