jQuery |多个 ID 选择器

给定一个 HTML 文档，任务是使用 JQuery 同时选择具有不同 ID 的元素。

方法：

• 选择不同元素的 ID，然后使用 each() 方法将 CSS 属性应用于所有选定 ID 的元素。
• 然后使用 css() 方法将所有选定元素的背景颜色设置为粉红色。
• 显示指示多个 ID 选择器的文本。

示例 1：在此示例中，选择不同 ID 的元素并更改这些元素的背景颜色。

 
 
     
         
            JQuery | Multiple ID selectors
        
      
        
            #GFG_DIV {
                background: green;
                height: 100px;
                width: 200px;
                margin: 0 auto;
                color: white;
            }
        
          
        
        
     
  
     
          
         
            GeeksForGeeks 
        
          
        
        
          
        
            This is Div box.
        
        
          
        
            click here
        
          
        
        
          
        
            $('#GFG_UP').text("Click on button to select multiple"
                    + " ID's and change their background-color");
              
            function GFG_Fun() {
                $("#GFG_UP, #GFG_DIV, #GFG_DOWN").each(function(){
                    $(this).css("background-color", "pink");
                });
                  
                $('#GFG_DOWN').text("Background-color of all "
                        + "elements is changed."); 
            }
         
     
                    

输出：

• 在点击按钮之前：
  
• 点击按钮后：
  

示例 2：在此示例中，选择了不同 ID 的元素并更改了这些元素的文本颜色。

 
 
     
         
            JQuery | Multiple ID selectors
        
      
        
            #GFG_DIV {
                background: green;
                height: 100px;
                width: 200px;
                margin: 0 auto;
                color: white;
            }
        
          
        
        
     
  
     
          
         
            GeeksForGeeks 
        
          
        
        
          
        
            This is Div box.
        
        
          
        
            click here
        
          
        
        
          
        
            $('#GFG_UP').text("Click on button to select multiple"
                    + "ID's and change their Text color");
          
        function GFG_Fun() {
            $("#GFG_UP, #GFG_DIV, #GFG_DOWN").each(function(){
                $(this).css("color", "blue");
            });
              
            $('#GFG_DOWN').text("Text color of all elements is "
                    + "changed."); 
        }
         
     
                    

输出：

• 在点击按钮之前：
  
• 点击按钮后：
  

jQuery 是一个开源 JavaScript 库，它简化了 HTML/CSS 文档之间的交互，它以其“少写，多做”的理念而广为人知。
您可以按照此 jQuery 教程和 jQuery 示例从头开始学习 jQuery。