js 对应思想实现汽车尾号限行

大闸蟹~

于 2022-03-10 11:15:34 发布

阅读量191

点赞数

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

本文链接：https://blog.csdn.net/YCHH1/article/details/123396755

版权

js 专栏收录该内容

33 篇文章 0 订阅

订阅专栏

这篇博客探讨了JavaScript中如何使用二维数组和按钮点击事件来实现特定功能。通过给每个按钮绑定点击事件，当按钮被点击时，对应的数组元素将显示在页面上，展示了JavaScript中的映射思想和事件处理技巧。

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

<body>
    <h3>关于  js 中的对应思想</h3>

    <div>
        <button>星期一</button>
        <button>星期二</button>
        <button>星期三</button>
        <button>星期四</button>
        <button>星期五</button>
    </div>

    <div>今日限行尾号为：<strong id="show">待查询</strong></div>

    <script>
        // 二维数组
        var arr = [[1,6],[2,7],[3,8],[4,9],[5,0]];

        // 获取元素
        var btns = document.getElementsByTagName("button");
        var show = document.getElementById("show");

        // 利用 IIFE 实现正确获取索引
        for(var i = 0;i<btns.length;i++){
            (function (j){
                btns[j].onclick = function(){
                    // console.log(j);
                    // console.log(arr[j]);

                    // show.innerHTML = arr[j];
                    show.innerHTML = arr[j][0] + "和" + arr[j][1];
                }
            })(i)
        }
    </script>
</body>

大闸蟹~

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
js 对应思想实现汽车尾号限行

<body> <h3>关于 js 中的对应思想</h3> <div> <button>星期一</button> <button>星期二</button> <button>星期三</button> <button>星期四</button> <button>星
复制链接

扫一扫