jQuery实现每隔几条元素增加1条线的方法 

 1  $(".list2 li:nth-child(10n)").after('<li style="margin:10px 0px;border-bottom:1px dashed #ccc;"></li>');
 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 4 <html xmlns="http://www.w3.org/1999/xhtml">
 5 <head>
 6 <meta http-equiv="Content-Type"content="text/html; charset=utf-8"/>
 7 <title>jQuery每隔10条加一条线</title>
 8 <script language="JavaScript"src="jquery-1.7.2.min.js"></script>
 9 <script language="JavaScript"type="text/JavaScript">
10  $(document).ready(function(){
11   $(".list2 li:nth-child(10n)").after('<li style="margin:10px 0px;border-bottom:1px dashed #ccc;"></li>');
12 });
13  </script>
14   </head>
15   <body>
16     <style>
17     li{ list-style-type: none;}
18     </style>
19     <ul class="list2">
20         <li>001</li>
21         <li>002</li>
22         <li>003</li>
23         <li>004</li>
24         <li>005</li>
25         <li>006</li>
26         <li>007</li>
27         <li>008</li>
28         <li>009</li>
29         <li>010</li>
30         <li>011</li>
31         <li>012</li>
32         <li>013</li>
33         <li>014</li>
34         <li>015</li>
35         <li>016</li>
36         <li>017</li>
37         <li>018</li>
38         <li>019</li>
39         <li>020</li>
40         <li>021</li>
41         <li>022</li>
42         <li>023</li>
43         <li>024</li>
44         <li>025</li>
45         <li>026</li>
46         <li>027</li>
47         <li>028</li>
48         <li>029</li>
49         <li>030</li>
50         <li>031</li>
51         <li>032</li>
52     </ul>
53   </body>
54 </html>

 

posted @ 2017-01-19 13:43  ghfjj  阅读(392)  评论(0)    收藏  举报