js循环排他思想-点击按钮实现变色

<!-- 操作元素-排他思想 -->

    <button>按钮1</button>

    <button>按钮2</button>

    <button>按钮3</button>

    <button>按钮4</button>

    <button>按钮5</button>

    <script>

        // 获取所有按钮元素

        var btns = document.getElementsByTagName('button');

        //btns得到的是伪数组 里面每个元素 btns[i]

        for (var i = 0; i < btns.length; i++) {

            btns[i].onclick = function() {

                // 首先先把所有的按钮背景色去掉

                // 然后再给触发点按钮背景色pink

                for (i = 0; i < btns.length; i++) {

                    btns[i].style.backgroundColor = '';

                }

                this.style.backgroundColor = 'pink';

            }

        }