JQuery案例-排他思想

如下图，只能选着一个

涉及的重要知识

隐式迭代、同级元素

HTML代码

    <button>快进</button>
    <button>快进</button>
    <button>快进</button>
    <button>快进</button>
    <button>快进</button>
    <button>快进</button>

JS代码

    $(function () {
        // 给 所有 button 绑定点击事件
        $('button').click(function () {
            // 当前元素 设置一个背景颜色
            $(this).css('background','pink');
            // 当前元素其他同辈元素，去掉颜色
            $(this).siblings('button').css('background','')

            // 链式写法
            $(this).css('background','pink').siblings('button').css('background','')
        })
    })