如何用jq库实现反选和全选；

  <script src="./jquery-3.6.0.min.js"></script>

 <div id="content">
        <p> <label for="qx" class="qx"><input class="s1"  type="checkbox" id="qx">全选</label></p>
        <p> <label for="wxm"><input class="s2" type="checkbox" id="wxm">王小明</label></p>
        <p> <label for="lq"><input class="s2" type="checkbox" id="lq">李强</label></p>
        <p> <label for="zy"><input class="s2" type="checkbox" id="zy">张雨</label></p>
        <p> <label for="lzq"><input class="s2" type="checkbox" id="lzq">李志强</label></p>
        <p> <label for="fx"><input  class="s3"type="checkbox" id="fx">反选</label></p>
    </div>

html标签

<script>
    $(function() {
        //全选和全不选；
        $('.s1').click(function() {
            $('.s3').prop('checked', false); //清掉s3；
            console.log(this.checked)
            if (this.checked) {
                $('.s2').prop('checked', true);
                //获取当前点击事件的父标签，修改父标签里面的文本节点，替换；
                this.parentNode.replaceChild(document.createTextNode('全不选'), this.parentNode.lastChild);

            } else {
                $('.s2').prop('checked', false);
                this.parentNode.replaceChild(document.createTextNode('全选'), this.parentNode.lastChild);
            }
            console.log(this.checked);
        })
    })

    //反选；
    $('.s3').click(function() {
        $('.s1').prop('checked', false); //清掉s1
        var s4 = document.querySelectorAll('.s2');
        console.log(s4[1].checked);
        for (var i = 0; i < s4.length; i++) {
            if (s4[i].checked) {
                $(s4[i]).prop('checked', false);
            } else {
                $(s4[i]).prop('checked', true);
            }
        }

    })
</script>

 js实现

标签：checked,反选,jq,parentNode,prop,全选,false,s4
来源： https://blog.csdn.net/qq_63186320/article/details/120978232