js 排他思想案例

  <!-- 排他思想 -->

     <button>按钮1</button>
     <button>按钮2</button>
     <button>按钮3</button>
     <button>按钮4</button>
     <button>按钮5</button>
     <script>
         var btns = document.getElementsByTagName("button")
         for (var i = 0; i < btns.length; i++) {
             btns[i].onclick = function () {
                 // 首先把使用的按钮背景颜色去掉
                 for (var j = 0; j < btns.length; j++) {
                     btns[j].style.backgroundColor = ''
                 }
                 // 然后设置当前的元素背景颜色
                 this.style.backgroundColor = 'pink'
             }
         }
         // 首先先排除其他
         // 然后设置自己的样式这个叫排他样式
     </script>