Skip to main content

HTML DOM tagName Property in JAVA SCRIPT

The tagName property returns the tag name of the element.
In HTML, the returned value of the tagName property is always in UPPERCASE.
This property is read-only.
Tip: You can also use the nodeName property to return the tag name of an element. The difference is that nodeName also returns attribute nodes, text nodes, comment nodes.
Syntax: element.tagName
Return Value: A String, representing the tag name of the element in uppercase
Different types of way how to define tagName Property in program.
CODING:
<!DOCTYPE html>
<html>
<body>
<h1 id="h1"></h1>
<h1></h1>
<h3></h3>
<p></p><p></p><p></p><p></p><p></p><p></p>
<div>
<h1></h1>
<h2></h2>
<p></p><p></p><p></p><p></p><p></p><p></p>
</div>
<div id="idDiv">
<h1></h1><li>hjg</li><p></p>
</div>
<script type="text/javascript">
    var h1=document.getElementsByTagName("h1");
    document.getElementById("h1").innerHTML="HTML DOM getElementsByTagName() Method";
    document.getElementsByTagName("*")[5].innerHTML="h2 tag";
    document.getElementsByTagName("h3")[0].innerHTML="h3 tag";
    var l=document.getElementsByTagName("p");
    for (var i = 0; i <l.length; i++) {
    l[i].innerHTML=i+1+" p tag";
    }
    var div=document.getElementsByTagName("div")[0];
    div.getElementsByTagName("h1")[0].innerHTML="h1 tag in div";
    div.getElementsByTagName("h2")[0].innerHTML="h1 tag in div";
    var pInDiv=div.getElementsByTagName("p");
        for (i = 0; i <pInDiv.length; i++) {
    pInDiv[i].innerHTML=i+1+" p tag in Div";
    }
       var idDiv=document.getElementById("idDiv").getElementsByTagName("*");//("specified  tag")
      for (i = 0; i <idDiv.length; i++) {
    idDiv[i].innerHTML=i+1+" tag in idDiv of div";
   }
     var li=document.getElementById("idDiv").getElementsByTagName("li")[0].style.color="red";
</script>
</body>
</html>

Comments

Post a Comment