js实现文字超出规定的字数后显示查看更多

当文字超出一定的字数后，在后面显示查看更多...

效果图：

代码如下：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>文字超出隐藏</title>
 6 </head>
 7 <body>
 8     <div class="box">
 9         我的超出部分会被隐藏掉！！！
10     </div>
11 </body>
12 <script type="text/javascript" src="https://blog-static.cnblogs.com/files/wh35/jquery-3.2.1.min.js"></script>
13 <script type="text/javascript">
14     $(".box").each(function() {
15         var str = $(this).html();
16         var subStr = str.substring(0, 10);
17         $(this).html(subStr + (str.length > 10 ? \'...\' + "<a href=\'#\' class=\'active\'>查看更多</a>" : \'\'));
18     });
19 </script>
20 </html>