The Document object represents the current document being viewed in the browser. As this is a HTML document, made up of various elements (links, forms, etc), then the Document object is the parent of the various document level elements below it in the hierarchy list, but below the Window object object in the object model hierarchy.
Document Properties
activeElement
The Internet Explorer 4.0 specific activeElement property returns the currently active element (i.e that which has the focus) in the document. Note that for most elements, the activeElement property will return a reference to the main document <BODY> element, except if the element with the focus is a control-like element (i.e. any of the Form elements) or is contained within a suitable container (such as the Table elements). The activeElement property is Internet Explorer 4.0 specific.
alinkColor
The alinkColor property reflects the active link colouring, as set by any <BODY ALINK="..."> settings for the current document. It is a writable property, that is, the document active link colour can be set dynamically. For example :
document.alinkColor="#FF0000"
would set the current documents active link colour to red. NOTE : Internet Explorer doesn't support the ALINK attribute, so while the property may be readable (the author may have set the ALINK attribute for Netscape users), attempting to dynamically change the active link colour would do nothing.
all
The all property is an indexed array of all the elements contained in a document. For more information, see the All collection. The all collection/property is Internet Explorer 4.0 specific.
anchors
The anchors property is an indexed array containing all the current document's anchors. For more information, see the Anchors collection/array topic.
applets
The applets property is an indexed array of all the Java applets contained in a document. For more information, see the Applets collection/array.
areas
The areas property is an indexed array of all the <AREA> elements contained in a document. For more information, see the Areas collection/array.
bgColor
The bgColor property reflects the document's background colour, as set by any <BODY BGCOLOR="..."> settings for the current document. It is a writable property, that is, the document background colour can be set dynamically. For example :
document.bgColor="#FFFFE0"
would set the current documents background colour to a light yellow (the colour of this current topic).NOTE : In Internet Explorer, trying to dynamically alter a documents background colour, if that colour has been set in a style sheet, would not do anything.
body
The body property is a reference to the documents <BODY> element and as such contains the entire text of the document. The body property is useful for creating Text Range objects from the documents text. For more information, see the TextRange object. The body property is Internet Explorer 4.0 specific.
cookie
The cookie property reflects the string value of a cookie accessed, or created by the current document. For more details about the use of cookies, visit http://home.netscape.com/newsref/std/cookie_spec.html
domain
The domain property can be used to set or returns the security domain for a document, which will allow documents originating from different servers to be able to communicate with each other. For example, if you have different servers for www.mysite.com and beta.mysite.com, documents loaded from each server (perhaps into a framed setup) would not initially be able to communicate and share properties etc., unless the document.domain=mysite.com property has been set in all the documents that require such resource sharing.
embeds
The embeds property is an indexed array of any data embedded into a document, to be used by any available plug-in modules. For more information, see the Embeds collection/array.
expando
The Internet Explorer 4.0 specific expando property accepts a boolean value (i.e. either true or false) that sets whether arbitrary properties can be declared for any element in the document. Internet Explorer 4.0 allows unknown properties (and attributes) to be set on element objects. This can be useful as a debugging aid when authoring JScript script functions. Internet Explorer 4.0's JScript implementation (based on the ECMA standard scripting language) is totally case-sensitive, so setting:
document.all['elExample'].style.fontsize="24"
would actually create a new property for the style of the element referenced by elExample if the expando property on the document object was set to true (the default). This may not hold the same value as the fontSize property of the elements Style Object. For example, the title topics in this HTMLib all use an extra XSIZE and YSIZE attribute in <A> elements, which is interpreted by the host application to size the popups. If the expando property was set to false, the HTMLib would crash when trying to use these attributes.
fgColor
The fgColor property reflects the document's foreground colour, as set by any <BODY TEXT="..."> settings for the current document. It is a writable property, that is, the document foreground colour can be set dynamically. For example :
document.fgColor="#0000FF"
would set the current documents foreground (i.e. text) colour to blue. NOTE : In Internet Explorer, trying to dynamically alter a documents text colour, if that colour has been set in a style sheet, would not do anything.
forms
The forms property is an indexed array of any forms contained in a document. It is itself an object and for more information, see the Forms Collection topic.
frames
The frames property is an indexed array of any <IFRAME>, floating frames contained in a document. For more information, see the Frames Collection topic. Note : The Frames collection, as a property of the Document object, is Internet Explorer specific. Netscape maintains the Frames collection as a property of the Window Object topic for more information.
images
The images property is an indexed array of a documents images. For more information, see the Images collection.
lastModified
This property stores the date that the document was last modified (as stored by the web server). It cannot be altered dynamically, but can be read. For example :
document.write ("Last modified : " & document.lastModified)
would insert the document's most recent modification date where the script portion is positioned in the document.
layers
The layers property contains a reference to each Layer Object in the document (as defined by <LAYER> and <ILAYER> elements). For more information, see the Layer Object topic. Note : The layers property is Netscape 4.0 specific.
linkColor
The linkColor property reflects the document's hypertext link colour, as set by any <BODY LINK="..."> settings for the current document. It is a writable property, that is, the document link colour can be set dynamically. For example :
document.linkColor="#008000"
would set the current documents link colour to a dark green. NOTE : In Internet Explorer, trying to dynamically alter a documents text colour, if that colour has been set in a style sheet, would not do anything.
links
The links property is an indexed array of all the document's links. For more information, see the Links collection.
location
The location property contains a reference to each documents Location Object. See the Location Object topic for more information.
parentWindow
The parentWindow property returns a reference to the referenced documents parent window. For example, if documents are loaded into new windows, the parentWindow property could be interrogated to obtain a reference to the documents window, to then be able to manipulate that window. The parentWindow property is Internet Explorer 4.0 specific.
plugins
The plugins property is an indexed array of any plug-in objects contained in a document. Note that the plug-ins collection is subtly different for Internet Explorer and Netscape. For more information, visit the PlugIns collection
readyState
The readyState property can be one of 4 values, depending on the current state of the document. The possible values of the readyState property are:
| Value | Meaning |
complete |
The resource has completely loaded and is available to the document and therefore manipulation. |
interactive |
The resource hasn't completely downloaded, but is available to the document and scripting |
loading |
The resource is being downloaded |
uninitialized |
The resource is not available - normally, this value indicates that the resource is downloading |
Note that the readystate property is read-only and is Internet Explorer 4.0 specific
referrer
This property is a read-only property that contains the URL of the source document that the user navigated from to get to the current document. NOTE : Netscape rightly reports the URL of the source document used to navigate to the current document, but Internet Explorer appears to always return the URL of the current document only.
scripts
The scripts property is a reference to the Scripts collection (an indexed array, referencing every <SCRIPT> element in the document. For more information, see the Scripts collection topic. The scripts property is Internet Explorer 4.0 specific.
selection
The selection property is a reference to any current document content that the user may have selected. It's a reference to a Selection object, see that topic for more information. The selection property is Internet Explorer 4.0 specific, although Netscape supports the getSelection method of the document object (see below).
styleSheet
The styleSheets property is a reference to any Style Sheets attached to the current document. It is an indexed array (see the StyleSheets collection) of StyleSheet Objects. The styleSheets property is Internet Explorer 4.0 specific.
tags
The tags collection is used for Netscape specific Javascript Style Sheets. See the Javascript Style Sheets topic for more information.
title
The title property reflects the document's title, as set in the <TITLE> element.
URL
The URL property contains the fully qualified URL of a document and is typically identical to the location.href property of the Location and Window objects.
vlinkColor
The vlinkColor property reflects the document's visited link colour, as set by any <BODY VLINK="..."> settings for the current document. It is a writable property, that is, the document visited link colour can be set dynamically. For example :
document.vlinkColor="#400040"
would set the current documents visited link colour to a dark purple (the default colour for visited links). NOTE : In Internet Explorer, trying to dynamically alter a documents text colour, if that colour has been set in a style sheet, would not do anything.
Document Methods
clear
This Internet Explorer specific method closes the data stream and updates display of any text/HTML written to the document by write or writeLn methods. It is essentially identical to the close method.
close
The close method is used to close the data stream after a series of document write or writeLn method operations. It forces the display of the text/images (any standard HTML) sent during the write or writeLn methods.
createElement
The createElement method can be used to create a new instance of either an <IMG> or <OPTION> element, which can then be added to the Images collection or Options collection respectively. For example:
newOption = document.createElement("OPTION")
creates a new <OPTION> element and:
document.forms(index).elements("<SELECT>reference").options.add newOption, 0
would add the newly created <OPTION> object to the Options collection of the <SELECT> element referenced by <SELECT>reference on the form referenced by forms(index), where index is the index of the referenced form in the documents Forms collection.
For example, enter some text in the text box below, then click the button to add that text to the <SELECT> options collection:
Note that the size of the <SELECT> drop-down box will increase to accommodate the new option text.
Note : At the time of writing, Internet Explorer 4.0 was not supporting the creation of new <IMG> elements using the createElement method. Also note that this method is Internet Explorer 4.0 specific.
createStyleSheet
The createStyleSheet method can be used to create and add a StyleSheet Object to the referenced document. It accepts two optional arguments of URL and index. If URL is specified the new StyleSheet Object will be added to the StyleSheets Collection as if it were <LINK>d into the document. If no URL is given, then the new Style Sheet object will be added to the StyleSheets collection as if it were an embedded style sheet using the <STYLE> element.
elementFromPoint
The elementFromPoint method can be used to determine the element at any given position in the document, according to its x and y co-ordinates (relative to the top-left corner of the current viewing window). For example:
set whichElement=document.elementFromPoint(100,50)
would set the whichElement object reference to the element whose content covers the point 100 pixels in and 50 pixels down from the top-left corner of the current viewing window. Enter some co-ordinates in the following two text boxes, then click the button to retrieve the tagName property of the element at those co-ordinates (which will also be highlighted).
Note : This method is Internet Explorer 4.0 specific.
execCommand
The Internet Explorer 4.0 specific execCommand method can be used to execute a number of commands over an entire document, or a Text Range. The syntax is:
Boolean = object.execCommand(command [, bool [, value]])
where:
The possible Command Identifiers are:
| Command | Description | Value |
| BackColor | sets the background colour of the referenced text | #rrggbb|Colour name |
| Bold | Wraps a <B> element around the referenced object |
- |
| Copy | Copies the referenced object to the clipboard | - |
| CreateBookmark | Wraps a <A NAME="..."> element around the referenced object |
String - bookmark to use |
| Create Link | Wraps a <A HREF="..."> element around the referenced object |
String - URL for link |
| Cut | Copies the referenced object to the clipboard, then removes it from the document | - |
| Delete | Deletes the referenced object | - |
| FontName | Sets the typeface for the referenced object | String - Font Name |
| FontSize | Sets the font size for the referenced object | String - size |
| ForeColor | Sets the foreground (i.e. text) colour for the referenced object | #rrggbb | Colour Name |
| FormatBlock | Wraps a specified block-level element around the referenced object | String - block level element to use |
| Indent | Indents the referenced object | - |
| InsertButton | Inserts a <BUTTON> element at the current insertion point |
String - ID value |
| InsertFieldSet | Inserts a <FIELDSET> element at the current insertion point |
String - ID value |
| InsertHorizontalRule | Inserts a <HR> element at the current insertion point |
String - ID value |
| InsertIFrame | Inserts a <IFRAME> element at the current insertion point |
String - SRC value |
| InsertInputButton | Inserts a <INPUT TYPE="button"> element at the current insertion point |
String - ID value |
| InsertInputCheckbox | Inserts a <INPUT TYPE="checkbox"> element at the current insertion point |
String - ID value |
| InsertInputFileUpload | Inserts a <INPUT TYPE="FileUpload"> element at the current insertion point |
String - ID value |
| InsertInputHidden | Inserts a <INPUT TYPE="hidden"> element at the current insertion point |
String - ID value |
| InsertInputPassword | Inserts a <INPUT TYPE="password"> element at the current insertion point |
String - ID value |
| InsertInputRadio | Inserts a <INPUT TYPE="radio"> element at the current insertion point |
String - ID value |
| InsertInputReset | Inserts a <INPUT TYPE="reset"> element at the current insertion point |
String - ID value |
| InsertInputSubmit | Inserts a <INPUT TYPE="submit"> element at the current insertion point |
String - ID value |
| InsertInputText | Inserts a <INPUT TYPE="text"> element at the current insertion point |
String - ID value |
| InsertMarquee | Inserts a <MARQUEE> element at the current insertion point |
String - ID value |
| InsertOrderedList | Inserts a <OL> element at the current insertion point |
String - ID value |
| InsertParagraph | Inserts a <P> element at the current insertion point |
String - ID value |
| InsertSelectDropdown | Inserts a <SELECT TYPE="dropdown"> element at the current insertion point |
String - ID value |
| InsertSelectListbox | Inserts a <SELECT TYPE="Listbox"> element at the current insertion point |
String - ID value |
| InsertTextArea | Inserts a <TEXTAREA> element at the current insertion point |
String - ID value |
| InsertUnorderedList | Inserts a <IL> element at the current insertion point |
String - ID value |
| Italic | Wraps a <I> element around the referenced object |
- |
| JustifyCenter | Centers the referenced object | - |
| JustifyFull | Full justifies the referenced object | - |
| JustifyLeft | Left justifies the referenced object | - |
| JustifyRight | Right justifies the referenced object | - |
| Outdent | Outdents the referenced object | - |
| OverWrite | Sets the typing mode - insert or over-write | Boolean - true=over-write, false=insert |
| Paste | Places clipboard contents at the current insertion point (can only paste text copied by the copy command in script | - |
| PlayImage | Starts playing any dynamic (i.e. video, animated GIF's etc) images with the referenced object | - |
| Refresh | Reloads the source of the current document | - |
| RemoveFormat | Removes formatting for the referenced object | - |
| RemoveParaFormat | Removes any paragraph formatting for the referenced object | - |
| SelectAll | Selects the whole document text | - |
| StopImage | Stops playing of all dynamic images | - |
| Underline | Wraps a <U> around the referenced object |
- |
| Unlink | Removes a link | - |
| Unselect | Empties any selections from the document | - |
Note : Different Command Identifiers are supported 4.0 for the Document Object (or the Text Range object). However, it's clear to see the intention behind the execCommand method. Total content manipulation capabilities will for example, allow people to build totally customisable WYSIWYG HTML editors, based on Internet Explorer 4.0, which will put the Internet Explorer 4.0 HTML rendering engine in a very strong position.
getSelection
This Netscape 4.0 specific method returns a string which contains the text of the current users selection.
open
The open method is used to open a data stream, typically followed by write or writeLn methods. It can accept a MIME type as a parameter, but by default uses 'text/html', so that standard HTML can be written to the document using the aforementioned write and writeLn methods.
queryCommandEnabled
The Internet Explorer 4.0 specific queryCommandEnabled method allows you to determine whether a specific command (as defined by its command identifier is available for the referenced object. As mentioned before, certain commands aren't available for the respective Document Object or Text Range objects, so the queryCommandEnabled method should be used to determine whether the command is enabled for the referenced object before attempting to use the command. The queryCommandEnabled method takes one argument, which should be a string containing one of the Command Identifiers.
queryCommandIndeterm
The Internet Explorer 4.0 specific queryCommandIndeterm method can be used to determine whether a specific command is in the indeterminate state or not. It accepts one argument - a string value containing the Command Identifier in question.
queryCommandState
The Internet Explorer 4.0 specific queryCommandState method is used to determine the state of any command issued with the execCommand method (see above). It returns true if the command was successfully carried out on the referenced object, false if the command failed.
queryCommandSupported
The Internet Explorer 4.0 specific queryCommandSupported method can be used to determine whether the command is currently on or off. It accepts a single argument of a string value defining the Command Identifier to be queried and returns a boolean value of true is the command is on for the referenced object, or false if it isn't.
queryCommandText
The Internet Explorer 4.0 specific queryCommandText method can be used to determine the the string associated with a command. It accepts the standard string argument of the Command Identifier together with a string value which can be either Name or StatusText which specified whether to return the short name of the command in question, or the status bar text which may appear with the specific command.
queryCommandValue
The Internet Explorer 4.0 specific queryCommandValue method can be used to determine the value argument used in the execCommand method. See the Command Identifiers for details of the values used with certain commands.
write
This method can be used to write data (text, or any standard HTML) to a document. For example :
document.write "Hello, I've been scripted into the document"
would write the text string given into the document. It would appear wherever the script that contains the write method is placed in the document, unless the string to write to the document contains certain formatting data. For example :
document.write "<P ALIGN='right'>Hello, I've been scripted into the document"
would write the same text to the document, but it would be a separate, right-aligned paragraph.
writeLn
The writeLn method is essentially identical to the write method, except that it implies a line break after the string to write to the document. As line breaks are ignored by browsers though, the two methods tend to act identically.
Document Events
Internet Explorer 4.0 supports the following standard Dynamic HTML Events: onclick, ondblclick, ondragstart, onhelp, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup and onselectstart. See the standard Dynamic HTML Events topic for details of these. Netscape supports some of these events for the Document Object. See the standard Dynamic HTML events for details. Additionally, it supports the following events:
onerror
The onerror event fires whenever there is an error when attempting to display a document. Note : The onerror event for the Document Object is Internet Explorer 4.0 specific.
onload
The onload event fires whenever the document finishes loading. For entire documents, the onload event is more commonly handled in the Window Object.
© 1995-1998, Stephen Le Hunte