Document

Summary

Document is one of the most important objects in the DOM. It is where many API methods and properties are rooted.

Properties

activeElement: Gets the object that has the focus when the parent document has focus. If no element in the document has focus, returns the <body> element.
body: Gets or sets the body element of the document.
characterSet: Gets the preferred MIME name of the document’s character encoding.
charset: Gets or sets the preferred MIME name of the document’s character encoding.
cookie: Sets or gets the string value of a cookie.
defaultCharset: Gets the default character set from the current regional language settings.
defaultView: Returns the Document’s browsing context’s Window object (essentially the environment in which objects are presented to the user) if there is one, or null otherwise.
designMode: Sets or gets a value that indicates whether the document can be edited.
doctype: Gets an object that represents the document type declaration that is associated with the current document.
documentElement: Gets the root node of the document.
domain: Insecure. Use the web messaging API (postMessage and the message event) instead. Gets or sets the security domain of the document.
forms: This property returns an object array representing an HTMLCollection of all the forms in the document.
fullscreenElement: Exposes the current fullscreen state, returning the element that is displayed fullscreen, or null if there is no such element.
fullscreenEnabled: Exposes the current document’s fullscreen capability, returning true if the document can display elements in fullscreen, or false if not.
head: Gets the head element of the document.
hidden: document.hidden returns true if the document is hidden or false if it is visible at all
images: Legacy method. Use document.querySelectorAll(“img”) instead. Gets a live collection of img elements in a document.

implementation
:

inputEncoding: Gets the character encoding that is used for the text that is loaded into the document object.
lastModified: Gets the date that the document was last modified, if the document supplies one.

linkColor
:

links
:

readyState: Retrieves a value that indicates the current state of the object.
referrer: Gets the URL of the location that referred the user to the current document.

scripts
:

title: Gets or sets the title of a Document. When the document is the main document that is shown (meaning, not of an iframe), this is usually shown to the user.
visibilityState: Returns the visibility state of a webpage.
visibilitychange: Set the visibility state of an element

vlinkColor
:

xmlEncoding: Gets a value that represents the character encoding that is specified in the declaration of an XML document.
xmlStandalone: Gets or sets the value of the standalone attribute in the declaration of an XML document.
xmlVersion: Gets or sets the version attribute that is specified in the declaration of an XML document.

Methods

adoptNode: Tries to move a node from one document to the document that the document object displays. It is preferable to use importNode instead.
close: Closes an output stream and forces the sent data to display.
createAttribute: Creates an attribute object with a specified name.
createAttributeNS: Creates a reference to an attribute object that is associated with an XML namespace.
createCDATASection: Creates a CDATA section that contains the specified text.
createComment: Creates a comment object with the specified data.
createDocumentFragment: Creates a new document fragment (DocumentFragment) object.
createElement: Creates an instance of the element for the specified tag.
createElementNS: Creates an element from the specified namespace as a stand-alone object (unattached to the DOM).
createEvent: Creates a DOM event of the specified type. This method is deprecated; use event constructors (CustomEvent) instead.
createNodeIterator: Creates a NodeIterator object that you can use to traverse filtered lists of nodes or elements in a document.
createProcessingInstruction: Creates a processing instruction for an XML parser.
createRange: Creates an empty Range instance object that has both of its boundary points positioned at the beginning of the document. After a Range is created, you must set its starting and ending boundary points before you can make use of most of its methods.
createTextNode: Creates a text node containing the passed string (nodeValue).
createTreeWalker: Creates a TreeWalker object that you can use to traverse filtered lists of nodes or elements in a document.
elementFromPoint: Returns the element at the specified x and y coordinates.
exitFullscreen: The exitFullscreen method provides a way for exiting the fullscreen mode enabled by requestFullscreen.
getElementById: Gets an element with a specified ID.
getElementsByClassName: Gets a collection of all descendant elements with given classes. Not recommended; see Notes.
getElementsByName: Returns an HTMLCollection of elements in the document that have a name attribute with the specified value.
getElementsByTagName: Returns an HTMLCollection of all descendant elements with a given tag name.
getElementsByTagNameNS: Returns an HTMLCollection of the elements with the specified tag name and namespace.
getNamedFlows: Gathers NamedFlow objects, each representing a set of content that flows through various layout regions.
hasFocus: Returns the focus state of the current document, true if the document has focus, false if not.
importNode: Imports a node from another document into the the document that the document object displays.

open
:

register: Registers a new, custom element and returns the element’s constructor.
releaseCapture: Removes mouse capture from the object in the current document.
write: Method to insert a string of marked up text in the document tree.

writeln
:

Events

rowenter
:

rowexit
:

rowsdelete
:

rowsinserted
:

scroll
:

select
:

selectionchange
:

selectstart
:

start
:

stop
:

storage
:

storagecommit
:

Examples

if (document.title !== "") {
    console.log("The title is " + document.title)
}

This example shows an event handler function that displays the current position of the mouse, relative to the upper-left corner of the document, in a console window.

<!doctype html>
<html>
 <head>
  <title>Report mouse moves</title>
  <script>
    function reportMove()
    {
      console.log("X = " + window.event.x + ", Y = " + window.event.y);
    }
  </script>
 </head>
 <body onmousemove="reportMove()">
  <h1>Welcome!</h1>
 </body>
</html>

Usage

 Use the document object to examine, modify, or add content to an HTML document and to process events within that document. In a script, the document object can be referenced through the document property of the window object or it can be referenced directly.

Related specifications

DOM Level 2 HTML: Recommendation
DOM Level 3 Core: Recommendation
W3C HTML5: Working Draft
WHATWG HTML: Living Standard
HTML5: Candidate Recommendation