在html中酝润，文本過長是經(jīng)常遇到的問題，解決過程中有不同場景构回，不同的解決方法。
單文本
el{
width: {自己長度};
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
多文本
el{
height: 100px;
line-height: 20px;
overflow: hidden;
}
萬能js解決
在node中
str 為自己文本疏咐， limit 為自己需要的長度 ,在react中使用特別有效
{ (str.length > limit) ? ((str.substring(0, len(str) - limit)) + '...') : str }
正常hmtl中
<html>
<head>
<script type="text/javascript">
//加載html結(jié)束后再執(zhí)行js
document.addEventListener('DOMContentLoaded', function() {
var elemArr = document.getElementsByClassName("txt-10");
for (const elem of elemArr) {
txt = elem.innerHTML
l = txt.length
if (l > 10) {
var sub = txt.substring(0, 10)
sub = sub + " ..."
elem.innerHTML = sub
}
}
});
</script>
</head>
<body>
<div class="txt-10">abcdefghijklmnopqrs</div>
<div class="txt-10">abcdefghijklmnopqrstttttt</div>
</body>
</html>
