js多行溢出省略号

；一个文本溢出省略号的js方法，无论内容是什么

strSub(v){
            let str = v;
            let count = 0;
            var p = document.createElement("p");
            	//添加一个标签和要显示的标签的所有样式一样；
                p.style=`box-sizing: border-box;
                    padding: 8px 10px 14px 10px;
                    font-size: 14px;
                    background: rgba(255, 255, 255, 0.8);
                    line-height: 24px;
                    width: 283px;
                    word-break: break-all;`
                p.innerHTML = str;
            var div = document.createElement("div");
            div.style.position = "absolute";
            div.style.left = "-10000px";
            div.appendChild(p);
            document.body.appendChild(div);
            if(p.offsetHeight>220){//写死的盒子的高度；略高一点，又不至于多出一行；可以配活；
                while(p.offsetHeight>220){
                    count++;
                    p.innerHTML = str.substring(0,str.length-count);
                }
                str = str.substring(0,str.length-count-2)+"...";
            }
            document.body.removeChild(div);//移除他不然数不清了；
            return str;
        }

我这个是vue中的所以加到了filters里面；这是其中的方法
==============================================================`
思路：假设要求一个盒子指定行数溢出，内容可能有各种东西，首先确保数字和字母可以正常换行word-break: break-all;画一个和页面显示一样的盒子，监控盒子的高度，js添加的盒子高度超出了页面显示盒子的高度就循环减掉字符串的长度，一直到高度不超过为止
如果要兼容ie不能用模板字面量