jQuery学习笔记---全选反选_综合

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><input type="button" value="全选" οnclick="chooseAll()"/><input type="button" value="取消" οnclick="cancelAll()"/><input type="button" value="反选" οnclick="reverseAll()"/><table id="tb" border="1px solid red" width="200px"><thead><tr><th>选项</th><th>IP</th><th>PORT</th></tr></thead><tbody><tr><td><input type="checkbox"/></td><td>0.0.0.1</td><td>80</td></tr><tr><td><input type="checkbox"/></td><td>0.0.0.2</td><td>80</td></tr><tr><td><input type="checkbox"/></td><td>0.0.0.3</td><td>80</td></tr><tr><td><input type="checkbox"/></td><td>0.0.0.4</td><td>80</td></tr><tr><td><input type="checkbox"/></td><td>0.0.0.5</td><td>80</td></tr></tbody></table><script src="jquery-1.12.4.js"></script><script>function chooseAll(){$('#tb :checkbox').prop('checked',true);}function cancelAll(){$('#tb :checkbox').prop('checked',false);}function reverseAll(){//反选//1./*//三元运算符  var v = 条件？真：假var myTrs = document.getElementById('tb').children[1].children;var len = myTrs.length;for(i=0;i<len;i++){var opt = myTrs[i].children[0].children[0].checked;var rever = opt?false:true;myTrs[i].children[0].children[0].checked = rever;}//2.$('#tb :checkbox').each(function(k){//k是索引，0 1 2 3//this 代表每个循环的元素  属于DOM对象   var opt = this.checked?false:true;this.checked = opt;})//3.jQuery$('#tb :checkbox').each(function(k){var opt = $(this).prop('checked');    //$(this) jQuery对象if(opt){$(this).prop('checked',false);}else{$(this).prop('checked',true);}})*///3.jQuery 三目$('#tb :checkbox').each(function(k){var opt = $(this).prop('checked')?false:true;$(this).prop('checked',opt);})}</script>
</body>
</html>