jquery第九期:map,has,each用法
<html> <head> <script type="text/javascript" src="jquery-1.10.1.js"></script> <script type="text/javascript"> $(function() { //通过map可以有效的将某个包装集中的元素转换程数组 var ids = $("tbody td:nth-child(1)").map(function() { // return $(this).html(); var n = $(this).next("td"); var p = {"id":$(this).html(),"name":n.html()}; return p; }).get(); for(var i=0;i<ids.length;i++) { alert(ids[i].name); } }); </script> </head> <body> <table width="700" border="1" align="center" id="second"></table> <table width="300" border="1" align="center" id="first"> <tr> <td>用户标识</td> <td>用户姓名</td> <td>用户年龄</td> <td>用户密码</td> </tr> <tr id="abc"> <td id="cde">A</td> <td>张三</td> <td>12</td> <td>hehe1</td> </tr> <tr> <td>B</td> <td>李四</td> <td>13</td> <td>hehe2</td> </tr> <tr> <td>C</td> <td>王五</td> <td>14</td> <td>hehe3</td> </tr> <tr> <td>D</td> <td>牛六</td> <td>15</td> <td>hehe4</td> </tr> </table> </body> </html>
<html> <head> <script type="text/javascript" src="jquery-1.10.1.js"></script> <script type="text/javascript"> //has返回的是新包装集,获取存在有ul的li $(function() { $("div").has("span").css("color","red"); $("li").has("ul").css("color","red"); }); </script> </head> <body> <div> <span class="w1">aaaaaa</span> </div> <div> <span>bbbbbbb</span> </div> <ul> <li>a</li> <li>b</li> <li> <ul> <li>nnnn</li> <li>mmmm</li> </ul> </li> <li> lllll </li> </ul> </body> </html>
<html> <head> <script type="text/javascript" src="jquery-1.10.1.js"></script> <script type="text/javascript"> $(function() { $("tbody td:nth-child(2)").each(function(n) { $(this).html($(this).prev("td").html()+"."+$(this).html()); } ); }); </script> </head> <body> <table width="700" border="1" align="center" id="second"></table> <table width="300" border="1" align="center" id="first"> <tr> <td>用户标识</td> <td>用户姓名</td> <td>用户年龄</td> <td>用户密码</td> </tr> <tr id="abc"> <td id="cde">A</td> <td>张三</td> <td>12</td> <td>hehe1</td> </tr> <tr> <td>B</td> <td>李四</td> <td>13</td> <td>hehe2</td> </tr> <tr> <td>C</td> <td>王五</td> <td>14</td> <td>hehe3</td> </tr> <tr> <td>D</td> <td>牛六</td> <td>15</td> <td>hehe4</td> </tr> </table> </body> </html>
补充:web前端 , JavaScript ,