js#css#html 简易全选选择框（锻炼逻辑思维）

最新推荐文章于 2023-02-28 21:58:39 发布

Ankry果冻

最新推荐文章于 2023-02-28 21:58:39 发布

阅读量229

点赞数

分类专栏： javascript 文章标签： js javascript css html

本文链接：https://blog.csdn.net/weixin_41306215/article/details/105447007

版权

这篇博客介绍了如何用JavaScript、CSS和HTML创建一个简单的全选选择框功能，强调通过实践这种小项目可以提升逻辑思维能力。

摘要由CSDN通过智能技术生成

效果：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta id="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
    </style>
    <script>
        window.onload=function(){
            //获取四个多选
            var items=document.getElementsByName("items");
            //获取全选/全不选 多选框
            var checkedAllBox=document.getElementById("checkedAllBox");


            //1.checkedAllBtn
                var checkedAllBtn=document.getElementById("checkedAllBtn");
                checkedAllBtn.onclick=function(){
                    for(var i=0;i<items.length;i++)

最低0.47元/天解锁文章

Ankry果冻

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js#css#html 简易全选选择框（锻炼逻辑思维）

效果： <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta id="viewport" content="width=device-width, initial-scale=1.0"> <title>D...
复制链接

扫一扫

专栏目录