The DOM nav object is used to represent the HTML <nav> element. The<nav> element is accessed by getElementById().
Syntax:
document.getElementById("id")
Where id is assigned to the <nav> tag.
Note: The Nav Object is not supported by Internet Explorer 8 and earlier versions.
Example 1: In this example, we will see the use of the DOM Nav Object.
HTML
<!DOCTYPE html>
< html >
< head >
< title >
HTML DOM Nav Object
</ title >
</ head >
< body >
< h1 >
GeeksforGeeks
</ h1 >
< h2 >HTML DOM nav Object</ h2 >
< nav id = "nav_object" >
< a href = "#" >Data Structure</ a > |
< a href = "#" >Algorithm</ a > |
< a href = "#" >Programming Languages</ a >
</ nav >
< br >
< button onclick = "Geeks()" >
Click Here!
</ button >
< p id = "sudo" ></ p >
< script >
function Geeks() {
let obj = document.getElementById("nav_object").innerHTML;
document.getElementById("sudo").innerHTML = obj;
}
</ script >
</ body >
</ html >
|
Output:
Example 2: Nav Object can be created by using the document.createElement method.
HTML
<!DOCTYPE html>
< html >
< head >
< title >
HTML DOM nav Object
</ title >
</ head >
< body >
< h1 style = "color:green;" >
GeeksForGeeks
</ h1 >
< h2 >DOM nav Object</ h2 >
< button onclick = "Geeks()" >
Click Here!
</ button >
< br >< br >
< script >
function Geeks() {
let ele = document.createElement("NAV");
document.body.appendChild(ele);
let a = document.createElement("A");
a.setAttribute("href", "/html");
let txt = document.createTextNode("Home");
a.appendChild(txt);
ele.appendChild(a);
}
</ script >
</ body >
</ html >
|
Output:
Supported Browsers:
- Google Chrome
- Edge
- Mozilla Firefox
- Opera
- Safari
Last Updated :
15 Jun, 2023
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...