全选、不选和反选按钮

最新推荐文章于 2024-04-02 19:39:43 发布

阿汤的大眼睛

最新推荐文章于 2024-04-02 19:39:43 发布

阅读量237

点赞数 1

分类专栏： # JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/Big_eyes123/article/details/84328239

版权

JavaScript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

今天我看了网易云课堂里面的js入门视频，学会了如何做全选、不选和反选按钮。具体如下:

 <!DOCTYPE HTML>
<html>
	<head>
		<title></title>
		<style>
         
		</style>
        <script>
            window.onload=function(){
                var obut=document.getElementById('but1');
                var obut2=document.getElementById('but2');
                var obut3=document.getElementById('but3');
                var odiv=document.getElementById('div1');
                var ofu=odiv.getElementsByTagName('input');
                obut.onclick=function(){
                    for(var i=0;i<ofu.length;i++){
                        ofu[i].checked=true;
                    };
                };
                obut2.onclick=function(){
                    for(var i=0;i<ofu.length;i++){
                        ofu[i].checked=false;
                    };
                };
                obut3.onclick=function(){
                    for(var i=0;i<ofu.length;i++){
                        if(ofu[i].checked==true){
                            ofu[i].checked=false;
                        }else
                        ofu[i].checked=true;
                    };
                };
            };
        </script>
	</head>
	<body>
        <input id="but1" type="button" value="全选" /><br />
        <input id="but2" type="button" value="不选" /><br />
        <input id="but3" type="button" value="反选" /><br />
        <div id="div1">
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        </div>
	</body>
</html>

阿汤的大眼睛

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
全选、不选和反选按钮

今天我看了网易云课堂里面的js入门视频，学会了如何做全选、不选和反选按钮。具体如下: &lt;!DOCTYPE HTML&gt;&lt;html&gt; &lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;style&gt; &lt;/style&gt; &lt;script&gt;
复制链接

扫一扫