js給文本添加行號
阿新 • • 發佈:2019-04-22
.text func line type list over script UNC ctype
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>添加行號</title> </head> <style> .content{ line-height: 30px; list-style: none; } .lineNum{ line-height: 30px; list-style: none; } </style> <body style="overflow: hidden;line-height: 30px;"> <ul style="float: left;" class="lineNum"> </ul> <ul style="float: left;" class="content"> <li>哈哈哈哈。 </li> <li>哈哈哈哈。</li> <li>哈哈哈哈。</li><li>哈哈哈哈。</li><li>哈哈哈哈。</li><li>哈哈哈哈。</li><li>哈哈哈哈。</li><li>哈哈哈哈。</li> </ul> </body> <script src="js/jquery-3.3.1.min.js"></script> <script type="text/javascript"> window.onload = function() { //數組的長度 var lineNum = $('.content').text().split('。').length; var html = ''; for(var i = 1; i <lineNum; i++) { html += "<li>" + i + "</li>"; $('.lineNum').html(html); } } </script> </html>
js給文本添加行號