多个具有相同id的元素的响应

当有几个元素具有相同的id时，如

    <div id="red">1</div>
    <div id="red">2</div>
    <div id="red">3</div>
    <div id="red">4</div>
    <div id="red">5</div>

他们会都响应在css文件中对该id的描述，如

    <style>
        div {
            width: 200px;
            height: 100px;
            margin-top: 20px;
        }
        
        #red {
            background-color: red;
        }
    </style>

此时浏览器显示为
但如果在js中使用id选择器来改变样式，只有第一个具有对应id的元素会响应这个改变

    <script>
        function btnclick() {
            $('#red').css("background-color", "blue")
        }
    </script>

此时浏览器显示
如果想要所有具有相同id的元素都响应，则可以使用属性选择器

        function btnclick2() {
            $('div[id="red"]').css("background-color", "blue")
        }

此时浏览器显示