text-overflow:ellipsis是我们用来设置文本溢出的常用属性。但是究竟是什么触发了文本溢出，大多数人肯定没有探索过。之前没注意。反正css样式是这样的，要是溢出了，点一下就好了。表格文字过长隐藏后，鼠标悬停不悬停提示我一开始不相信。是不是我用的element-UI还有问题？但是看了源码后翻出来constcellChild=event.target.querySelector('.cell');if(hasClass(cellChild,'el-tooltip')&&cellChild.scrollWidth>cellChild.offsetWidth&&this.$refs.tooltip){//执行浮窗显示操作}问题出在cellChild.scrollWidth>cellChild.offsetWidth为了方便控制??元素宽度，设置了box-sizing:border-box；按照理解，scrollWidth是内容的宽度，offsetWidth是容器宽度的宽度。不会有问题，但是谁也没想到，当scrollWidth===offsetWidth时，text-overflow:ellipsis居然生效了。重现效果：http://jsfiddle.net/f0dmkkh8/1/我天真地认为cellChild.scrollWidth>=cellChild.offsetWidth是不够的。知道看了element-UI的最新代码，才知道自己错了。原来scrollWidth超过offsetWidth并不是触发text-overflow:ellipsis的条件。constrange=document.createRange();范围.setStart(cellChild,0);range.setEnd(cellChild,cellChild.childNodes.length);constrangeWidth=range.getBoundingClientRect().width;constpadding=(parseInt(getStyle(cellChild,'paddingLeft'),10)||0)+(parseInt(getStyle(cellChild,'paddingRight'),10)||0);使用range对象截取dom片段后得到的DOMRect对象的宽度就是内容的真实宽度。（scrollWidth不是内容区域的真实宽度）也就是说，当//添加padding应该是box-sizing:border-box;rangeWidth+padding>cellChild.offsetWidth才是真正触发text-overflow:ellipsis的条件。
