HTML | DOM DFN Object
The DOM DFN Object is used to represent the HTML <dfn> tag. The DFN element is accessed by getElementById().
Syntax:
document.getElementById("ID");Where “id” is the ID assigned to the “dfn” tag.
Example-1:
<!DOCTYPE html><html> <head> <title>DOM DFN Object</title></head> <body> <H2>DOM DFN Object</H2> <p> <!-- Id assigned to the dfn tag. --> <dfn id="GFG">Geeksforgeeks </dfn> is a portal for geeks. </p> <button onclick="myGeeks()">Submit</button> <script> function myGeeks() { <!-- accessing dfn --> var gfg = document.getElementById("GFG"); gfg.style.color = "coral"; gfg.style.fontSize = "20px"; } </script></body> </html> |
Output:
Before Clicking On Button :
After Clicking On Button:
Example-2: DFN Object can be created by using the document.createElement Method.
<!DOCTYPE html><html> <head> <title>DOM DFN Object</title></head> <body> <H2 style="font-size:35px;"> DOM DFN Object </H2> <p>It is a portal for geeks.</p> <button onclick="myGeeks()"> Submit </button> <script> function myGeeks() { var gfg = document.createElement("DFN"); var f = document.createTextNode("GeeksForGeeks"); gfg.appendChild(f); document.body.appendChild(gfg); } </script></body> </html> |
Output :
Before Clicking On Button :
After Clicking on Button:
Supported Browsers: The browser supported by DOM DFN Object are listed below.
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Safari
Please Login to comment...