SOURCE

console 命令行工具 X clear

                    
>
console
const str = "adsahdljhasdljasdjasdjaskdjassadasdasdasdasdassdasdasdasdasldasd";
const container = document.getElementById("container")
container.innerHTML = str;

const maxWidth = 200;
const maxRow = 2;

const calcuteWidth = (text, fontSize = "14px") => {
    let span = document.getElementById("__getwidth");
    if (!span) {
        span = document.createElement("span");
    };
    span.id = "__getwidth";
    span.style.visibility = "hidden";
    span.style.fontSize = fontSize;
    span.style.whiteSpace = "nowrap";
    span.innerText = text;
    document.body.appendChild(span);
    const width = span.offsetWidth;
    document.body.removeChild(span);
    return width;
};

const width = calcuteWidth(str);
const res = []
if (width > maxWidth) {
    let i = 0;

    let strArr = str.split("");

    let tmp = "";
    const len = str.length
    while (i < len) {
        i++;
        let first = strArr.shift();
        if (calcuteWidth(tmp + first) > 200) {
            res.push(tmp);
            tmp = "";
        };
        if (i === len) res.push(tmp + first);
        tmp += first;
    }
};

console.log(res);

res.map((i, index) => {
    if (index < maxRow) {

        let div = document.createElement("div");
        div.innerText = i;
        if (index === maxRow - 1) {
            div.className += "textoverflow"
        }
        container.appendChild(div);

    }
})
<div id="container"></div>
.textoverflow{
    width: 190px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}