JavaScript实现数组储存与删除

最新推荐文章于 2024-12-20 00:16:18 发布

原创最新推荐文章于 2024-12-20 00:16:18 发布 · 337 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#JavaScript

JavaScript 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了一种使用JavaScript操作数组的方法，通过监听Checkbox状态变化，实现数组元素的动态添加和删除。具体实现中，利用了事件监听、数组的push和splice方法，以及includes和indexOf函数来判断和定位元素。

JavaScript实现数组储存与删除

<body>
    <div>
        <input type="checkbox"value="1" />
        <input type="checkbox"value="2" />
        <input type="checkbox"value="3" />
        <input type="checkbox"value="4" />
        <input type="checkbox"value="5" />
    </div>
    <script>
        var shu = [];
        var check = document.getElementsByTagName("input");
        for (var i = 0; i < check.length; i++) {
            check[i].addEventListener("change", ff, false);
        }
        function ff(){
            var zi = this.value;
            if (this.checked == true) {
                shu.push(zi);
            }
            if (this.checked == false) {
                var s = shu.includes(zi);
                if (s == true) {
                    var q = shu.indexOf(zi);
                    shu.splice(q, 1);
                }
            }
        }
    </script>

</body>

效果图：
在这里插入图片描述