Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- 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 cite object
The HTML DOM cite object is associated with the HTML <cite> element. The <cite> element is used to give reference to a cited creative work and title must be included. It can be painting, book, tv show, movies etc.
Syntax
Following is the syntax for −
Creating a cite object −
var x = document.createElement("CITE");
Example
Let us see an example of the HTML DOM cite object −
<!DOCTYPE html>
<html>
<body>
<p>Click the below button to create a CITE element.</p>
<button onclick="createCite()">CREATE</button><br><br>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Van_Gogh_-
_Starry_Night_-_Google_Art_Project.jpg/800px-Van_Gogh_-_Starry_Night_-
_Google_Art_Project.jpg" width="220" height="277" alt="The Starry night">
<script>
function createCite() {
var x = document.createElement("CITE");
var t = document.createTextNode("The Starry night.");
x.appendChild(t);
document.body.appendChild(x);
}
</script>
</body>
</html>
Output
This will produce the following output −
Click “CREATE” −
In the above example we have inserted an image using an <img> tag −
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Van_Gogh_-_Starry_Night_-_Google_Art_Project.jpg/800px-Van_Gogh_-_Starry_Night_-_Google_Art_Project.jpg" width="220" height="277" alt="The Starry night">
We have then created a button CREATE to execute createCite() method −
<button onclick="createCite()">CREATE</button>
The createCite() method creates a <cite> element and assigns it to the variable x. A text node containing some text is created and assigned to variable t. The text node is then appended to the <cite> element using the appendChild() method on variable x. The <cite> element along with the text node is then appended to the document body using the appendChild() method on the document body.
128 Views
