[JavaScript知识库]JS文字过长隐藏，鼠标悬停显示

原生JS的处理办法

此部分转载自链接: js 文字超出长度用省略号代替,鼠标悬停并以悬浮框显示.

以下展示最简单的办法，转载的原文还另举了一种onload方法挂载事件。

<div style='width:120px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;' title='鼠标悬浮显示的内容'>鼠标悬浮显示的内容</div> 

注意：设置宽度，overflow:hidden, white-space:nowrap, text-overflow:ellipsis四个属性缺一不可。这种写法在所有的浏览器中都能正常显示。
white-space:nowrap; 规定段落中的文本不换行
text-overflow:ellipsis; 文本溢出部分用省略号代替
overflow:hidden; 溢出元素不显示

vue下的处理办法

在el tabel中使用 show-overflow-tooltip来标记需要处理的单元格
效果如下