Web APIs exclusivity

Exclusive thoughts ：

If you have the same set of elements , We want an element to implement a certain style , Need to use the exclusive thought algorithm of the loop ：

1. All elements clear the style （ Kill the others ）

2. Style the current element （ Leave me alone ）

3. Note that the order cannot be reversed , First kill the others , Set yourself up

    <button> Button 1</button>
    <button> Button 2</button>
    <button> Button 3</button>
    <button> Button 4</button>
    <button> Button 5</button>
    <script>
        // 1.  Get all button elements 
        var btns = document.getElementsByTagName('button');
        // btns The result is a pseudo array    Every element in it  btns[i]
        for (var i = 0; i < btns.length; i++) {
            btns[i].onclick = function() {
                // (1)  Let's remove all the button background colors first    Get rid of everyone 
                for (var i = 0; i < btns.length; i++) {
                    btns[i].style.backgroundColor = '';
                }
                // (2)  Then let the current element background color be pink  Leave me alone 
                this.style.backgroundColor = 'pink';
​
            }
        }
    </script>