排他思想算法

卡卡西最近怎么样

已于 2022-04-28 15:54:08 修改

阅读量411

点赞数 3

分类专栏： JavaScript 零基础入门文章标签：算法 javascript 前端 html

于 2022-02-20 17:58:30 首次发布

本文链接：https://blog.csdn.net/weixin_52212950/article/details/123033529

版权

JavaScript 零基础入门专栏收录该内容

80 篇文章 43 订阅

订阅专栏

排他思想顾名思义即排除其他人再设置自己

下面举一个例子说明：

例如我们要设置五个按钮，要求点击后变色，不点击不变色，并且点击后再点击别的按钮会恢复颜色，首先我们会想到循环注册事件，我们可以在点击后先将所有颜色全部取消，然后再设置想要的颜色

代码：

<body>
    <button>按钮1</button>
    <button>按钮2</button>
    <button>按钮3</button>
    <button>按钮4</button>
    <button>按钮5</button>
    <script>
        var btn=document.querySelectorAll('button');
        for(var i=0;i<btn.length;i++){
            btn[i].onclick=function(){
                for(var i=0;i<btn.length;i++){  //先给所有元素背景颜色都设置为空
                    btn[i].style.backgroundColor='';
                }
                this.style.backgroundColor='green';  //再给目标元素背景设置相应颜色
            }
        }
    </script>
</body>

卡卡西最近怎么样

关注

3
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
排他思想算法

排他思想顾名思义即排除其他人再设置自己下面举一个例子说明：例如我们要设置五个按钮，要求点击后变色，不点击不变色，并且点击后再点击别的按钮会恢复颜色，首先我们会想到循环注册事件，我们可以在点击后先将所有颜色全部取消，然后再设置想要的颜色代码：<body> <button>按钮1</button> <button>按钮2</button> <button>按钮3</button>
复制链接

扫一扫