检查元素的内容是否溢出？ [英] Check if an element's content is overflowing?

问题描述

检测元素是否溢出的最简单方法是什么？

What's the easiest way to detect if an element has been overflowed?

我的用例是，我想限制某个内容框的高度为300px 。如果内部的内容高于那个，我会用溢出来切断它。但如果它溢出，我想显示一个更多按钮，但如果不是，我不想显示该按钮。

My use case is, I want to limit a certain content box to have a height of 300px. If the inner content is taller than that, I cut it off with an overflow. But if it is overflowed I want to show a 'more' button, but if not I don't want to show that button.

是否有一种简单的方法可以检测溢出，还是有更好的方法？

Is there an easy way to detect overflow, or is there a better method?

推荐答案

如果DOM元素溢出，此函数将返回布尔值：

This function will return you boolean value if the DOM element is overflowed:

function isOverflown(element) {
    return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;
}

元素可能垂直或水平溢出或两者都

The element may be overflowed vertically or horizontally or both

这篇关于检查元素的内容是否溢出？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！