在 JavaScript 中具有特定类的最近祖先元素

任务是在纯 Javascript 的帮助下找到特定类元素的最近祖先。下面讨论两种方法。

方法 1：使用Javascript 选择器选择元素。使用最接近的（）方法来获取具有特定类的最近的父级。

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

html

  
  
     
         
            Find closest ancestor element that has a 
            specific class using pure JavaScript
                
    
      
          
            GeeksforGeeks  
        
        
        
  
        
          
          
        
        
        click here
        
        
        
  
             
            var up = document.getElementById("GFG_UP"); 
            up.innerHTML = "Click on button to see result";
            var down = document.getElementById("GFG_DOWN"); 
            function myGFG() {  
                var el = document.querySelector("div")
                .closest(".parent")
                down.innerHTML = "Element of name '"
                  + el.getAttribute("name") 
                  + "' is the parent element of specific class."; 
            } 
         
      

输出：

方法 2 ：继续移动到元素的父级，直到找到特定的类。使用element.className.indexof() 方法来选择特定类的元素。

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

html

  
  
     
         
            Find closest ancestor element that has a 
            specific class using pure JavaScript
                
    
      
          
            GeeksforGeeks  
        
        
        
  
        
          
          
        
        
        click here
        
        
        
  
             
            var up = document.getElementById("GFG_UP"); 
            up.innerHTML = "Click on button to see result";
            var down = document.getElementById("GFG_DOWN");
            function findParent(el, clas) {
                while ((el = el.parentNode) && 
                       el.className.indexOf(clas) < 0);
                return el;
            }
            function myGFG() {  
                var el = document.querySelector(".child");
                var el = findParent(el, 'parent');
                down.innerHTML = "Element of name '" 
                  + el.getAttribute("name") 
                  + "' is the parent element of specific class."; 
            } 
         
      

输出：