jquery002-全选反选取消()

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title></head><body style="width: 980px;margin: 0 auto">    <input id="i1" type="button" value="全选" onclick="checkAll()"/>    <input id="i2" type="button" value="反选"/>    <input id="i3" type="button" value="取消"/>    <table border="1">        <thead>            <tr>                <th>操作</th>                <th>IP</th>                <th>PORT</th>            </tr>        </thead>        <tbody id="tb1">            <tr>                <td><input type="checkbox"/></td>                <td>1.2.3.4</td>                <td>66</td>            </tr>            <tr>                <td><input type="checkbox"/></td>                <td>1.2.3.4</td>                <td>66</td>            </tr>            <tr>                <td><input type="checkbox"/></td>                <td>1.2.3.4</td>                <td>66</td>            </tr>        </tbody>    </table>    <script src="jquery3.6.1.js"></script>    <script>        function  checkAll(){            $('#tb1 :checkbox').prop('checked',true);        }        var cancelALL = function (){            $('#tb1 :checkbox').prop('checked',false);        }        $('#i3').on('click',cancelALL);        var reverseAll = function (){            //'#tb1 :checkbox' 中间要有空格            //this是DOM对象,用jquery方法要用$(this)            $('#tb1 :checkbox').each(function (){                var res = $(this).prop('checked')?false:true;                $(this).prop('checked',res);            })        }        //on('click',reverseAll) 函数不用加括号,如果是在标签中绑定要加括号        $('#i2').on('click',reverseAll);    </script></body></html>
————————
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title></head><body style="width: 980px;margin: 0 auto">    <input id="i1" type="button" value="全选" onclick="checkAll()"/>    <input id="i2" type="button" value="反选"/>    <input id="i3" type="button" value="取消"/>    <table border="1">        <thead>            <tr>                <th>操作</th>                <th>IP</th>                <th>PORT</th>            </tr>        </thead>        <tbody id="tb1">            <tr>                <td><input type="checkbox"/></td>                <td>1.2.3.4</td>                <td>66</td>            </tr>            <tr>                <td><input type="checkbox"/></td>                <td>1.2.3.4</td>                <td>66</td>            </tr>            <tr>                <td><input type="checkbox"/></td>                <td>1.2.3.4</td>                <td>66</td>            </tr>        </tbody>    </table>    <script src="jquery3.6.1.js"></script>    <script>        function  checkAll(){            $('#tb1 :checkbox').prop('checked',true);        }        var cancelALL = function (){            $('#tb1 :checkbox').prop('checked',false);        }        $('#i3').on('click',cancelALL);        var reverseAll = function (){            //'#tb1 :checkbox' 中间要有空格            //this是DOM对象,用jquery方法要用$(this)            $('#tb1 :checkbox').each(function (){                var res = $(this).prop('checked')?false:true;                $(this).prop('checked',res);            })        }        //on('click',reverseAll) 函数不用加括号,如果是在标签中绑定要加括号        $('#i2').on('click',reverseAll);    </script></body></html>