HTML | DOM Body Object
The DOM Body Object is used to represent the HTML <Body> element. The Body element is accessed by getElementByTagName().It can also be access by using document.body object.
Object Properties:
- Alink: It is used to sets or returns the color of the active link in a Document.
- background: It is used to sets or returns the background image for a document.
- bgColor: It is used to sets or returns the backgroundColor for the document.
- link: It is used to sets or returns the color of the unvisited link in the document.
- text: It is used to sets or returns the color of a text in a document.
- vLink: It is used to sets or returns the color of the visited link in a document.
Example-1:
HTML
<!DOCTYPE html><html><head> <title>HTML DOM Body Object</title> <!-- style on the body tag --> <style> body { text-align: center; } </style></head><!-- body tag starts from here --><body> <h1>GeeksforGeeks</h1> <h2>DOM body Object</h2> <button onclick="myGeeks()">Submit</button> <p id="sudo"></p> <script> function myGeeks() { var w = document.getElementsByTagName("BODY")[0]; w.style.backgroundColor = "dodgerblue"; } </script></body></html> |
Output:
Before Clicking On Button:
After Clicking on Button:
Example-2: Body Object can be created by using the document.createElement Method.
HTML
<!DOCTYPE html><html><head> <title> HTML DOM Body Object</title> <style> h2 { font-size: 40px; } .gfg { font-size: 30px; text-align: center; } h1 { text-align: center; } p { font-size: 20px; margin: 20px 0; text-align: center; } </style> <center> <H2>DOM Body Object</H2> <button onclick="myGeeks()">Submit</button> <script> function myGeeks() { var w = document.createElement("BODY"); w.setAttribute("id", "GFG"); document.body.appendChild(w); var heading = document.createElement("H1"); var text1 = document.createTextNode("GeeksForGeeks"); heading.appendChild(text1); document.getElementById("GFG").appendChild(heading); var para = document.createElement("P"); var text2 = document.createTextNode("A Computer Science Portal" +" for Geeks."); para.appendChild(text2); document.getElementById("GFG").appendChild(para); } </script></head></html> |
Before Clicking On Button:
After Clicking on Button:
Supported Browsers: The browser supported by DOM Body Object are listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Safari
Please Login to comment...