<!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>
jquery循环方法
微信扫一扫
支付宝扫一扫
评论列表（0条）