Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
HTML DOM Footer object
The HTML DOM Footer object is associated with the HTML <footer> element. The <footer> element is a type of semantic tag and introduced in the HTML5. Using the Footer object we can create and get the <footer> element using the createElement() and getElementById() method respectively.
Syntax
Following is the syntax for −
Creating a footer object −
var p = document.createElement("FOOTER");Example
Let us look at an example of the Footer object −
<!DOCTYPE html>
<html>
<head>
<script>
function createFoot() {
var f = document.createElement("FOOTER");
document.body.appendChild(f);
var p = document.createElement("P");
var txt = document.createTextNode("Copyright ©, 2019");
p.appendChild(txt);
f.appendChild(p);
}
</script>
</head>
<body>
<h1>Footer object example</h1>
<p>Create a footer for this webpage by clicking the below button</p>
<button onclick="createFoot()">CREATE</button>
</body>
</html>Output
This will produce the following output −
On clicking the CREATE button −
In the above example −
We have first created a button CREATE that will execute the createFoot() method on being clicked by the user.
<button onclick="createFoot()">CREATE</button>
The createFoot() method creates a footer element using the createElement() method of the document object. We then append the footer element to the document body using the appendChild() method and create another <p> element using the createElement() method.
A text node is then created using the createTextNode() method of the document object. The text node is then appended to the paragraph using the appendChild() method on the paragraph. Finally the paragraph along with the text node are appended as children of the footer element using the appendChild() method on the footer element −
function createFoot() {
var f = document.createElement("FOOTER");
document.body.appendChild(f);
var p = document.createElement("P");
var txt = document.createTextNode("Copyright ©, 2019");
p.appendChild(txt);
f.appendChild(p);
}
505 Views
