如何在 JavaScript 中检查单击的元素是否为 div？

给定一个包含许多元素的 HTML 文档。任务是在 JavaScript 的帮助下判断被点击的元素是否为 DIV。
这里讨论了两种方法，第一种方法使用元素的tagName 属性，第二种方法使用instanceOf运算符搜索 DIV。
方法一：

• 使用element.tagName 属性，它返回元素的标签名。（例如.. if(el.tagName == 'DIV') 那么它是 DIV 否则不是）

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

  

    
        Check if an element is a div in JavaScript.
    
    
        #div {
            background: green;
            height: 100px;
            width: 200px;
            margin: 0 auto;
            color: white;
        }
    

  

      
            GeeksForGeeks  
        
    
    
    
        This is Div element.
    
    
    
    
        var up = document.getElementById('GFG_UP');
        var down = document.getElementById('GFG_DOWN');
        up.innerHTML = 
          "Click on any element to check if it's DIV or not.";
  
        function GFG_Fun(tagName) {
            // checking if the tagName is equal to 'DIV'.
            if (tagName == 'DIV') {
                down.innerHTML = "It's a DIV Element";
            } else {
                down.innerHTML = "It's not a DIV Element";
            }
        }
    

  

输出：

• 在点击元素之前：
  
• 点击元素后：
  

方法二：

• 使用instanceOf运算符，检查元素是否为HTMLDivElement 。

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

  

    
        Check if an element is a div in JavaScript.
    
    
        #div {
            background: green;
            height: 100px;
            width: 200px;
            margin: 0 auto;
            color: white;
        }
    

  

      
            GeeksForGeeks  
        
    
    
    
        This is Div element.
    
    
    
    
        var up = document.getElementById('GFG_UP');
        var down = document.getElementById('GFG_DOWN');
        up.innerHTML =
            "Click on any element to check if it's DIV or not.";
  
        function GFG_Fun(el) {
            // checking if the el is instance of HTMLDivElement
            if (el instanceof HTMLDivElement) {
                down.innerHTML = "It's a DIV Element";
            } else {
                down.innerHTML = "It's not a DIV Element";
            }
        }
    

  

输出：

• 在点击元素之前：
  
• 点击元素后：