isTextOverflow 如何js判断里面实际显示的文字有省略号?

判断一个元素中的文本是否被截断并替换为省略号比较复杂，因为 CSS 的text-overflow: ellipsis属性并没有提供我们一个明确的方式来获取这个状态。然而，我们可以通过一些简单的计算来推断出是否发生了这种情况。

以下示例代码将检查一个元素的内容是否有被截断：

function isTextOverflow(element) {
  return element.offsetWidth < element.scrollWidth;
}

const button = document.querySelector('button');
console.log(isTextOverflow(button)); // 如果内容被截断会返回true，否则返回false

在这个例子中，我们比较了元素的offsetWidth（可见区域的宽度）和scrollWidth（包括滚动内容的总宽度）属性。如果scrollWidth大于offsetWidth，说明有内容被溢出，因此元素的文本已被截断并显示为省略号。

不过需要注意的是，这种方式并不完全准确，因为存在一些情况可能会误判，例如元素中有换行，或者元素中有被隐藏的子元素等。