<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.1.1.js"></script>
</head>
<body>
<input type="button" value="全选" onclick="quanx()">
<input type="button" value="取消" onclick="quxiao()">
<input type="button" value="反选" onclick="fanxuan()">
<table border="1 ">
<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>
<tr>
<td><input type="checkbox"></td>
<td>444</td>
</tr>
</table>
</body>
<script>
function quanx() {
$("table tr td input").prop("checked",true);
}
function quxiao() {
$("table :checkbox").prop("checked",false);
}
function fanxuan() {
/*
Jquery的两种点击方式
li = [1,2,3,4,5,6,7,8,9];
$.each(li,function (a,b) {
console.log(a,b)
$("").each(function () {
$(this.html());
})
})
*/
/* input标签的属性值可以写成 标签:属性值,
attr 和prop的区别,一般有固定是固定属性值的用prop,自定义属性值的用attr
*/
$("table :checkbox").each(function () { /*遍历检查所有项*/
if($(this).prop("checked")){
$(this).prop("checked",false);
}else{
$(this).prop("checked",true);
}
});
}
</script>
</html>