文字超出显示....

最近由于项目上的需求，文字超出多少显示...，一开始觉得这个很简单，就是写个样式就好了，没想到啊，测试IE的时候出现问题了，不显示，周六收到测试人员打电话问怎么回事啊。。。。当时听到我也很无奈的，我记得我测的没问题啊（Chrome），抓紧给人家说你换成Chrome试一下，结果还真是。 而后确定是样式不兼容致使的了。 网上大多数都是这样写得

overflow:hidden;
    text-overflow:ellipsis; 
    -webkit-line-clamp:3;
    word-break: break-all;
    -webkit-box-orient:vertical;
     display: -webkit-box;
复制代码

我不知道为何个人只是显示一行，我设置了显示三行，可是不起做用。 实在不想折腾css，索性就直接使用js来，这个时候有个问题，由于没办法计算每个字符的宽度，只能一个一个的调试。若是兄弟你知道如何计算每个字符的宽度请留下你的代码我学习一下。

/**
  * 超出部分显示···
  * params:num type:number,com type:string
  * num 控制显示字符长度，com控制显示dom元素
  */
  function mitulineHide(num,com){
    let contain = document.querySelector(com);
    console.log(contain);
    let maxSize = num;
    let txt = contain.innerHTML;
    if(txt.length > num){
      console.log(1)
      txt = txt.substring(0,num-1)+"...";
      contain.innerHTML = txt;
    }else{
      return;
    }
  }

  mitulineHide(70,"p");
复制代码