The Document
object represents the current
document being viewed in the browser. It is the primary connection between
the object model and the HTML document and is initially defined by the
<HTML> tags
loaded by the browser from the server or file; the web page. While it is
below the Window
object, we can access it directly. e.g. window.document is correct,
but document on it's own works just fine.
As this is a HTML document, made up of various elements (links, forms, etc),
the Document
object is the direct parent of the various document
level elements below it in the hierarchy list. e.g. Instead of working with
window.document.html.body.forms[0] to access the
first form on the page, we can just access document.forms[0]. The
document object directly accesses all major objects in the DOM.
The part of the Document you see in the web page is the
<BODY>
.
The document
<TITLE>
is displayed on the tab above the browser (with the Flavicon).
window.document.URL contains the Location of the page.
Document Properties
document.
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
file: /Techref/language/html/ib/Scripting_Reference/doco.htm, 40KB, , updated: 2021/2/5 17:09, local time: 2024/12/24 22:56,
13.58.105.80:LOG IN
|
©2024 These pages are served without commercial sponsorship. (No popup ads, etc...).Bandwidth abuse increases hosting cost forcing sponsorship or shutdown. This server aggressively defends against automated copying for any reason including offline viewing, duplication, etc... Please respect this requirement and DO NOT RIP THIS SITE. Questions? <A HREF="http://linistepper.com/techref/language/html/ib/Scripting_Reference/doco.htm"> The Document object</A> |
Did you find what you needed? |