全选、数组去重、返回最大值示例

swallow_HC

已于 2023-03-17 16:22:34 修改

阅读量56

点赞数

文章标签： javascript 前端 css

于 2023-03-15 19:47:51 首次发布

本文链接：https://blog.csdn.net/anye_zhuzai/article/details/129565790

版权

全选代码示例

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

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .options{
            display: flex;
            flex-direction: column;
        }
    </style>
</head>

<body>
    <labe>
        <input type="checkbox" name="" id="selAll">全选
    </labe>
    <div class="options">
        <label for="">
            <input type="checkbox" name="play">运动
        </label>
        <label for="">
            <input type="checkbox" name="play">学习
        </label>
        <label for="">
            <input type="checkbox" name="play">打游戏
        </label>
        <label for="">
            <input type="checkbox" name="play">追剧
        </label>
        <label for="">
            <input type="checkbox" name="play">打牌
        </label>
    </div>
    <script>
       
        let selAll = document.getElementById('selAll')
        let chks = document.getElementsByName('play')
         // 全选
        selAll.onclick = function(){
           /*  for(let i=0;i<chks.length;i++){
                chks[i].checked =this.checked
            } */
            chks.forEach(ele=>{
                ele.checked = this.checked
            })
        }
        // 单选
        chks.forEach(chk=>{
            chk.onclick=function(){
                // 统计选中的复选框
                let cnt = 0
                chks.forEach(ele=>{
                   if( ele.checked){cnt++}
                })
                console.log(cnt);
              selAll.checked =  chks.length == cnt ? true :false
            }
        })

   // every（）方法全选
   // selAll.onclick=function(){
        //    Array.from(chks) .every(ele=>{
        //        ele.checked=this.checked
        //         return true
        //     })
        // }
    //some（）方法单选
        // Array.from(chks).forEach(chk=>{
        //    chk.onclick=function(){
        //       selAll.checked=! Array.from(chks).some(chk=>{
        //            return !chk.checked
        //        })
        //    }

        //     })

    </script>
</body>

</html>

数组去重代码示例

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

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数组去重</title>
</head>

<body>
    <script>
        // 去除数组中重复元素
        let arr = [12, 21, 34, 54, 34, 21, 15, 12]
        let res = []
        arr.forEach(val => {
            console.log(val);
            // 如果val不在res数组中，则添加到res数组里边去
            // if (res.indexOf(val) == -1) {
            if (!res.includes(val)) {
                res.push(val)
            }
        })
        console.log(res);

        let arr1 = [12, 21, 34, 58, 34, 21, 17, 12]
      console.log(Array.from( new Set(arr1)))
    </script>
</body>

</html>

返回最大值

    <script>
        let arrty = [10, 20, 50, 30, 100, 120];
        let ment = arrty[0];
        for (let i = 1; i < arrty.length; i++) {
            if (arrty[i] > ment)
                ment = arrty[i]
        }
        document.write(ment)

    </script>