DOM编程③ -- 排他思想
【摘要】
文章目录
什么是排他思想案例：
什么是排他思想
如果有同一组元素，我们想要某一个元素实现某种样式(它实现的时候，别人不能实现这种样式)， 需要用到循环的排他思想算法：
所有元素全部清除样...
什么是排他思想
如果有同一组元素，我们想要某一个元素实现某种样式(它实现的时候，别人不能实现这种样式)， 需要用到循环的排他思想算法：
- 所有元素全部清除样式（干掉其他人）
- 给当前元素设置样式 （留下我自己）
- 注意顺序不能颠倒，首先干掉其他人，再设置自己
案例：
点击哪个按钮，那个按钮变成粉色背景，不能同时存在多个！
代码实现：
<body>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<script>
let buttons = document.getElementsByTagName('button');
for(let i = 0;i < buttons.length;i++){
buttons[i].onclick = function(){
for(let n = 0;n < buttons.length;n++){
buttons[n].style.backgroundColor = '';
}
this.style.backgroundColor = 'pink';
}
}
</script>
</body>
</html>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
文章来源: blog.csdn.net，作者：十八岁讨厌编程，版权归原作者所有，如需转载，请联系作者。
原文链接：blog.csdn.net/zyb18507175502/article/details/123716382
【版权声明】本文为华为云社区用户转载文章，如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）