element-ui show-overflow-tooltip 原理记录
<div> <div class="spanDom">咯技术的和卡仕达卡仕达和凯撒接电话卡是ask就电话卡手机号</div> </div>
好奇其中原理就去搜资料看了一下,特此记录。
如上一串代码:
span内容过长出现省略号,这个就是一段css:
.a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
然后,要判断span内容的scrollWidth是否超出了div的clientWidth(div一定要设置宽度):
if (spanDom.scrollWidth > div.clientWidth) { spanDom.classList.add('a') // 其他操作 }
记录进步!!!