<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <p>p1</p> <p>p2</p> <p>p3</p> <script src="jquery-3.3.1.js"></script> <script> attr=[11,22,33] // for (var i=0;i<attr.length;i++) { // $('p').eq(i).html(attr[i]); // }; // js可以混用jquery // jquery循环方式一 $.each(attr,function (x,y) { console.log(x); // 0 1 2 console.log(y); // 11 22 33 }); // jquery循环方式二 $('p').each(function () { console.log($(this)); $(this).html('p'); }); // 对三个p标签进行循环，$this表示的是每个p标签，对标签的循环用的更多一些 </script> <!--正反选案例练习--> <button onclick="selectAll()">全选</button> <button onclick="reverse()">反选</button> <button onclick="cancel1()">取消</button> <table border="1px"> <tr> <td><input type="checkbox"></td> <td>111</td> </tr> <tr> <td><input type="checkbox"></td> <td>222</td> </tr> <tr> <td><input type="checkbox"></td> <td>333</td> </tr> </table> <script> function selectAll() { $(':checkbox').each(function () { $(this).prop('checked',true); }) }; function cancel1() { $(':checkbox').each(function () { $(this).prop('checked',false); }) }; function reverse() { $(':checkbox').each(function () { if ($(this).prop('checked')) { $(this).prop('checked',false) }else{ $(this).prop('checked',true) } }) }; </script> </body> </html>