js根据文字（保存大小，字体）计算文字长度，并根据容器显示省略号

需求：根据容器大小 判断是否显示省略号 容器与文本都是随机变化
问题：由于需求与技术限制，不能使用下面这种方法

>  /* 强制不换行 */
    white-space: nowrap;
    /* 文字用省略号代替超出的部分 */
    text-overflow: ellipsis;
    /* 匀速溢出内容，隐藏 */
    overflow: hidden;  

、

由此根据容器宽度和计算文本宽度来实现

//name 为要显示的文字
//titleWidth 为计算文本的宽度 传入文本 文本大小 文本字体 可动态变化
//width为容器大小 可动态变化
         var name
         let titleWidth=this.computeFontSize(str,text.fontSize, text.fontFamily).width
           if(titleWidth > width) {
           //计算每个字的平均宽度
             let len = titleWidth / str.split('').length
             let num
             //这两种字体偏小，所以比其他字体多取一位 仿宋 微软雅黑
             if ((text&&text.fontFamily == 'STFangsong') || (text&&text.fontFamily == 'Microsoft YaHei')) {
                 //根据每个字的平均宽度计算超出容器有几个字,减掉加省略号
                  num = Math.ceil((titleWidth - width) / len)+1
             } else {
                  num = Math.ceil((titleWidth - width) / len)+2
             }
             let nameTitle=str.split('').slice(0,str.split('').length-num).join('')+'...'
             name = nameTitle;
         } else {
             name=str
         }

computeFontSize(str, size, family) {
    let spanDom = document.createElement("span");
    spanDom.style.fontSize = size+'px'; //12px
    spanDom.style.fontFamily = family; //'STFangsong'
    spanDom.innerHTML = str;
    document.body.append(spanDom);
    let sizeD = {};
    sizeD.width = spanDom.offsetWidth;
    spanDom.remove();
    return sizeD;
}