如何使用 JavaScript 获取 DOM 元素的所有 ID？

给定一个 HTML 文档，任务是获取数组中 DOM 元素的所有 ID。有两种方法可以解决这个问题，下面讨论：

方法一：

• 首先使用$('*') 选择器选择所有元素，它选择文档的每个元素。
• 使用.each() 方法遍历所有元素并检查它是否有 ID。
• 如果它有 ID，则将其推送到数组中。

示例：此示例实现了上述方法。

  

    
        How to get all ID of the DOM
        elements with JavaScript ?
    
      
    
    

  

      
     
        GeeksForGeeks 
    
      
    
      
    
        Click Here
    
      
    
      
    
        var el_up = document.getElementById("GFG_UP");
        var el_down = document.getElementById("GFG_DOWN");
        el_up.innerHTML = "Click on the button to get "
                            + "all IDs in an array.";
  
        function gfg_Run() {
            var ID = [];
            $("*").each(function() {
                if (this.id) {
                    ID.push(this.id);
                }
            });
            el_down.innerHTML = ID;
        }
    

  

输出：

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

方法二：

• 首先使用$('*') 选择器选择所有元素，它选择文档的每个元素。
• 使用.map() 方法遍历所有元素并检查它是否有 ID。
• 如果它有 ID，则使用.get() 方法将其推送到数组中。

示例 2：此示例实现了上述方法。

  

    
        How to get all ID of the DOM
        elements with JavaScript ?
    
      
    
    

  

      
     
        GeeksForGeeks 
    
      
    
      
    
        Click Here
    
      
    
      
    
        var el_up = document.getElementById("GFG_UP");
        var el_down = document.getElementById("GFG_DOWN");
        el_up.innerHTML = "Click on the button to "
                    + "get all IDs in an array.";
  
        function gfg_Run() {
            var ID = [];
              
            ID = $("*").map(function() {
                if (this.id) {
                    return this.id;
                }
            }).get();
            el_down.innerHTML = ID;
        }
    

  

输出：

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