Methods of Document
Syntax:
document.method_name;
The lists of most commonly used methods are listed below:
- addEventListener(): It is used to attach an event handler to the specified element.
- adoptNode(): It is used to adopt a node from another document and it returns a node object, representing the adopted node.
- close(): It is used to close the output stream.
- createAttribute(): It is used to create an attribute node with the specified name and returns the attribute object.
- createComment(): It is used to create a comment node with some text.
- createDocumentFragment(): It is used to create the document fragment to change the content of the document.
- createElement(): It is used to create HTML element .
- createEvent(): It is used to create a new events object.
- createTextNode(): It is used to create a textnode.
- execCommand(): It is used to execute a command specified by the user on the editable selected section. It returns a Boolean value.
- fullscreenEnabled(): It is used to check whether the document can be viewed in fullscreen mode or not. It returns a boolean value.
- getElementById(): It returns the object of the given ID. If no object with that id exists then it returns null.
- getElementsByClassName(): It returns an object containing all the elements with the specified class names in the document as objects.
- getElementsByName(): It returns an object containing all the elements with the specified name in the document as objects.
- getElementsByTagName(): It returns an object containing all the elements with the specified tag names in the document as objects.
- hasFocus(): It returns a boolean value that indicates whether the document or element has focus or not.
- importNode(): It imports the copy of a node from another document in the current document.
- normalize(): It flushes out the empty nodes and merges the adjacent text nodes with the first text node and
- normalizeDocument(): It is used to normalize an HTML document by removing any empty text nodes and joining the adjacent text nodes.
- open(): It is used to open the output stream to collect the output.
- querySelector(): It returns the first element that matches a specified CSS selector(s) in the document.
- querySelectorAll(): It returns a collection of an element’s child elements that matches a specified CSS selector(s) in the document
- removeEventListener(): It removes the event handler from an element that has an attached event.
- renameNode(): It is used to rename the node.
- write(): It is used to write some content or javascript code in the document.
- writeln(): It is used to write a document with a newline character after each statement.
Example: This example describes the implementation of the document.object.
HTML
<!DOCTYPE html> < html > < head > < title >document's Properties</ title > < style > h1 { color: green; } </ style > </ head > < body > < h1 > w3wiki</ h1 > < button onclick = "myFunction()" >CLICK ME</ button > < p id = "demo" ></ p > < script > function myFunction() { let title = document.title; let domain = document.domain; let body = document.body; document.getElementById("demo").innerHTML = "the title of the document is : " + title + "< br >" + "domain : " + domain + "< br >" + "body : " + body; } </ script > </ body > </ html > |
Output:
Differences between Document and Window Objects
In this article, we will see the Document object & Window object, their various properties & methods, along with knowing their implementation & the differences between them.