<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="#">
<input type="text"/>
<input type="password"/>
<input type="radio"/>
<input type="checkbox"/>
<input type="hidden"/>
<input type="file"/>
<input type="image"/>
<input type="submit"/>
<input type="reset"/>
<input type="button"/>
<select name="sel" id="sel">
<option>ok</option>
</select>
<textarea name="ta" id="ta" cols="30" rows="4"></textarea>
</form>
<button onclick="getform()">获取表单项</button>
<hr/>
<br/><br/>
<div id="div2">
<input type="checkbox"/>吃饭
<input type="checkbox"/>睡觉
<input type="checkbox"/>打豆豆
</div>
<button onclick="chkall()">全选</button>
<button onclick="chkno()">全不选</button>
<button onclick="chkreverse()">反选</button>
<script src="jquery-1.12.2.min.js"></script>
<script>
// 针对 checked属性的控制，不能使用常规attr函数，而应该换用prop函数
// jQuery也有循环写法，用each函数
// each操作中，每次获取的都是标准的DOM方式的元素而不是jQuery的对象
function chkreverse(){
$("#div2 :checkbox").each(function(i){
// this.checked = !this.checked;
$(this).prop('checked', !($(this).prop('checked')));
});
}
function chkno(){
$("#div2 :checkbox").prop('checked', false);
}
function chkall(){
// var div2 = document.getElementById('div2');
// var ins = div2.getElementsByTagName('input');
// for(var i=0; i<ins.length; i++){
// if(ins[i].type=='checkbox'){
// ins[i].checked = true;
// }
// }
$("#div2 :checkbox").prop('checked', true);
}
function getform(){
// alert($(':input').length);
alert($(':button').length);
}
</script>
</body>
</html>