思想简介：
指人：先去除所有同类人，再把自己展现出来
指代码：先去除所有同类对象的样式，再把想要的那个对象样式加上去
我们经常在网页浏览会遇到菜单栏选择，购物选项选择的功能
选择一个后另选一个，第一个则会消失，这种效果就可以用排他思想来实现。
思想概述：
每次给被点击选择的元素对象添加样式前，先循环一遍同类元素将所有元素的样式取消
<!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>
</head>
<body>
<button>按钮1</button>
<button>按钮2</button>
<button>按钮3</button>
<button>按钮4</button>
<button>按钮5</button>
<script>
var btns = document.querySelectorAll('button');
for (var i = 0; i < btns.length; i++) {
btns[i].onclick = function () {
for(var i=0;i<btns.length;i++){
btns[i].style.background='';
}
this.style.background='pink';
}
}
</script>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
