javascript实现一行文字随不同设备自适应改变字体大小至完全展示

产品提了一个小需求，希望一行能展示用户输入的所有文字，因为最多限制为25字符，但是如果夹杂英文/韩文/日文等，即使字符数是一样的，但是展示的长度不一样，则有些title标题会被截断。

效果如图

前提是总字数有一个差不多展示一行的最大限制，否则文字太小，也不能保证正常展示。

<div id="titlebox">
         <div class="title" id="title">
                哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈啊哈哈哈
        </div>
</div>

//title字体大小自适应，以能完全在一行显示25个不同类型的字符。
    function fontauto() {
        let titlebox = document.getelementbyid("titlebox");
        let maxwidth = titlebox.offsetwidth;
        let title=document.getelementbyid("title");
        let size=4;
        title.style.fontsize = size + 'vw';
        while (title.scrollwidth > maxwidth) {
            //当容器高度大于最大高度的时候，上一个尝试的值就是最佳大小。
            size=size-0.2;
            title.style.fontsize = size+ 'vw';
        }
    }

思路：由于不同移动设备的分辨率不同，这里给font-size用的单位为vw,默认设置一个当前字体的font-size，获取到文字外层容器的宽度，判断文字的宽度是否大于容器的宽度，如果大于，则给当前的font-size减小0.1vw，如果px同理，可以按减小1px计算，然后成功。