The document Object

The document object is already a favorite of ours. This object corresponds to the current web page's body and some parts of the head. Using this object, you have access to the HTML of the page itself, including all the links, images, and anchors in it.

From a scripting point of view, the most popular d o cument object method is document.write , which we've already seen, as in this example from Chapter 1, which wrote text to a web page:

 <HTML>      <HEAD>          <TITLE>Our first script!</TITLE>      </HEAD>      <BODY>          <H1>Here we go!</H1>  <SCRIPT LANGUAGE="JavaScript">   <!--   document.write("Hello from JavaScript!")   // -->   </SCRIPT>  </BODY>  </HTML>

You'll find the properties, methods , and events of the document object in Table 4.7. As before, not all properties, methods, and events will be supported in all browsers. We'll get all the details on browser version for each property, method, and event in Chapter 9, "Using the document and body Objects."

Table 4.7. The Properties, Methods, and Events of the document Object

Properties	Methods	Events
`activeElement`	`attachEvent`	`onactivate`
`alinkColor`	`captureEvents`	`onbeforeactivate`
`all`	`clear`	`onbeforecut`
`anchors`	`clearAttributes`	`onbeforedeactivate`
`applets`	`close`	`onbeforeeditfocus`
`attributes`	`createAttribute`	`onbeforepaste`
`bgColor`	`createComment`	`onclick`
`body`	`createDocumentFragment`	`oncontextmenu`
`charset`	`createElement`	`oncontrolselect`
`characterSet`	`createEventObject`	`oncut`
`childNodes`	`createRange`	`ondblclick`
`cookie`	`createStyleSheet`	`ondeactivate`
`defaultCharset`	`createTextNode`	`ondrag`
`designMode`	`detachEvent`	`ondragend`
`doctype`	`elementFromPoint`	`ondragenter`
`documentElement`	`execCommand`	`ondragleave`
`domain`	`focus`	`ondragover`
`embeds`	`getElementById`	`ondragstart`
`expando`	`getElementsByName`	`ondrop`
`fgColor`	`getElementsByTagName`	`onfocusin`
`fileCreatedDate`	`getSelection`	`onfocusout`
`fileModifiedDate`	`handleEvent`	`onhelp`
`fileSize`	`hasFocus`	`onkeydown`
`firstChild`	`mergeAttributes`	`onkeypress`
`forms`	`open`	`onkeyup`
`frames`	`queryCommandEnabled`	`onmousedown`
`height`	`queryCommandIndeterm`	`onmousemove`
`ids`	`queryCommandState`	`onmouseout`
`images`	`queryCommandSupported`	`onmouseover`
`implementation`	`queryCommandValue`	`onmouseup`
`lastChild`	`recalc`	`onmousewheel`
`lastModified`	`releaseCapture`	`onpaste`
`layers`	`releaseEvents`	`onpropertychange`
`linkColor`	`routeEvent`	`onreadystatechange`
`links`	`setActive`	`onresizeend`
`location`	`write`	`onresizestart`
`mimeType`	`writeln`	`onselectionchange`
`namespaces`		`onstop`
`namespaceURI`
`nextSibling`
`nodeName`
`nodeType`
`ownerDocument`
`parentNode`
`parentWindow`
`plugins`
`previousSibling`
`protocol`
`readyState`
`referrer`
`scripts`
`security`
`selection`
`styleSheets`
`tags`
`title`
`uniqueID`
`URL`
`URLUnencoded`
`vlinkColor`
`width`

Tip

You might wonder about the documentElement property of the document object you see in Table 4.7; this property returns a reference to the <HTML> element at the very top of the document.