<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
.r-advInfo-itemText{
padding: 25px 20px;
background: pink;
color: #000;
border-radius: 40px;
width: 200px;
}
.r-advInfo-item p {
margin-top: 10px;
font-size: 14px;
color: #000;
line-height: 24px;
margin-top:20px;
}
</style>
</head>
<body>
<div class="r-advInfo-itemText">
<p id="qfr"></p>
</div>
<script>
LimitNumber('只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字只顯示20個文字','qfr');
/*用js限制字數，超出部分以省略號...顯示*/
function LimitNumber(txt,idName) {
var str = txt;
str = str.substr(0,20) + '...' ;
var id=document.getElementById(idName);
id.innerText=str;
}
</script>
</body>
</html>
代碼的最終效果：
