html – So verwenden Sie Javascript, um festzustellen, ob ein Div übergelaufen ist

Question

Auf der Webseite gibt es ein p-Element (id="info"). Seine Breite und Höhe sind wie folgt:

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

Es enthält mehrere p (oder andere Elemente auf Blockebene), die dynamisch über AJAX abgerufen werden. Wenn es also zu viele oder zu viele sind, führt dies zu einem Überlauf der Informationen. Daher ist der Überlaufstil der Informationen auf „Automatisch“ eingestellt, sodass Bildlaufleisten angezeigt werden, wenn der Inhalt überläuft.

Meine Frage ist:

Kann ich mithilfe von Javascript feststellen, ob diese Informationen übergelaufen sind?

Oder das geht auch: Per Javascript feststellen, ob die Info-Bildlaufleiste erschienen ist?

(Erklären Sie den Zweck davon. AJAX ruft kontinuierlich Informationen vom Server ab, aber die Länge der jedes Mal erhaltenen Einträge kann sehr unterschiedlich sein, sodass ich nicht weiß, welches Element angezeigt wird, wenn die Informationen überlaufen. Wenn die Wenn die Info überläuft, löscht das Programm die alten Einträge entsprechend, sonst sammeln sie sich weiterhin in der Info an)

Answer 1

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

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

关于scrollHeight和clientHeight可以看看MDN的介绍:
scrollHeight

clientHeight