document.fgColor
If you express the color as a hexadecimal RGB triplet, you must use the format rrggbb. For example, the hexadecimal RGB values for salmon are red=FA, green=80, and blue=72, so the RGB triplet for salmon is "FA8072."
You can override
the value set in the fgColor property in either of the following
ways:
document.fgColor="aqua"The following example sets the color of the foreground text to aqua using a hexadecimal triplet:
document.fgColor="00FFFF"
1. navigator.plugins[index].filename 2. navigator.plugins[pluginName].filename
filename is a read-only property.
<INPUT TYPE="file" NAME="fileUploadName" [onBlur="handlerText"] [onChange="handlerText"] [onFocus="handlerText"] >
fileUploadName.propertyName fileUploadName.methodName
propertyName is one of the properties listed below.
methodName is one of the properties listed below.
A FileUpload object is a form element and must be defined within a <FORM> tag.
| Property | Description |
|---|---|
| form property | Specifies the form containing the FileUpload object |
| name | Reflects the NAME attribute |
| type | Reflects the TYPE attribute |
| value | Reflects the current value of the file upload element's field; this corresponds to the name of the file to upload. This is a read-only property for security purposes. |
|
|
|
<FORM NAME="form1">
File to send: <INPUT TYPE="file" NAME="myUploadObject">
<P>Get properties<BR>
<INPUT TYPE="button" VALUE="name"
onClick="alert('name: ' + document.form1.myUploadObject.name)">
<INPUT TYPE="button" VALUE="value"
onClick="alert('value: ' + document.form1.myUploadObject.value)"><BR>
</FORM>
stringName.fixed()
var worldString="Hello, world" document.write(worldString.fixed())The previous example produces the same output as the following HTML:
<TT>Hello, world</TT>
Math.floor(number)
function getFloor(x) {
return Math.floor(x)
}
If you pass getFloor the
value 45.95, it returns 45; if you pass it the value -45.95, it returns
-46.
1. fileUploadName.focus() 2. passwordName.focus() 3. selectName.focus() 4. textName.focus() 5. textareaName.focus() 6. frameReference.focus() 7. windowReference.focus()
passwordName is either the value of the NAME attribute of a Password object or an element in the elements array.
selectName is either the value of the NAME attribute of a Select object or an element in the elements array.
textName is either the value of the NAME attribute of a Text object or an element in the elements array.
textareaName is either the value of the NAME attribute of a Textarea object or an element in the elements array.
frameReference is a valid way of referring to a frame, as described in the Frame object.
windowReference is a valid way of referring to a window, as described in the window object.
Note
On some platforms, the focus method gives focus to a frame but the focus is not visually apparent (for example, the frame's border is not darkened). Please see the release notes (after starting Netscape, choose Release Notes from the Help menu).
function checkPassword(userPass) {
if (badPassword) {
alert("Please enter your password again.")
userPass.focus()
userPass.select()
}
}
This example assumes that the
Password object is defined as
<INPUT TYPE="password" NAME="userPass">
stringName.fontcolor(color)
color is a string or a property of an existing object, expressing the color as a hexadecimal RGB triplet or as one of the string literals listed in "Color values".
If you express color as a hexadecimal RGB triplet, you must use the format rrggbb. For example, the hexadecimal RGB values for salmon are red=FA, green=80, and blue=72, so the RGB triplet for salmon is "FA8072."
The fontcolor method overrides a value set in the fgColor property.
var worldString="Hello, world"
document.write(worldString.fontcolor("maroon") +
" is maroon in this line")
document.write("<P>" + worldString.fontcolor("salmon") +
" is salmon in this line")
document.write("<P>" + worldString.fontcolor("red") +
" is red in this line")
document.write("<P>" + worldString.fontcolor("8000") +
" is maroon in hexadecimal in this line")
document.write("<P>" + worldString.fontcolor("FA8072") +
" is salmon in hexadecimal in this line")
document.write("<P>" + worldString.fontcolor("FF00") +
" is red in hexadecimal in this line")
The previous example produces the
same output as the following HTML:
<FONT COLOR="maroon">Hello, world</FONT> is maroon in this line <P><FONT COLOR="salmon">Hello, world</FONT> is salmon in this line <P><FONT COLOR="red">Hello, world</FONT> is red in this line <FONT COLOR="8000">Hello, world</FONT> is maroon in hexadecimal in this line <P><FONT COLOR="FA8072">Hello, world</FONT> is salmon in hexadecimal in this line <P><FONT COLOR="FF00">Hello, world</FONT> is red in hexadecimal in this line
stringName.fontsize(size)
size is an integer between one and seven, a string representing a signed integer between one and seven, or a property of an existing object.
When you specify size as an integer, you set the size of stringName to one of the seven defined sizes. When you specify size as a string such as "-2," you adjust the font size of stringName relative to the size set in the <BASEFONT> tag.
var worldString="Hello, world"
document.write(worldString.small())
document.write("<P>" + worldString.big())
document.write("<P>" + worldString.fontsize(7))
The previous example produces the
same output as the following HTML:
<SMALL>Hello, world</SMALL> <P><BIG>Hello, world</BIG> <P><FONTSIZE=7>Hello, world</FONTSIZE>
<FORM NAME="formName" TARGET="windowName" ACTION="serverURL" METHOD=GET | POST ENCTYPE="encodingType" [onReset="handlerText"] [onSubmit="handlerText"]> </FORM>
TARGET="windowName" specifies the window that form responses go to. When you submit a form with a TARGET attribute, server responses are displayed in the specified window instead of the window that contains the form. windowName can be an existing window; it can be a frame name specified in a <FRAMESET> tag; or it can be one of the literal frame names _top, _parent, _self, or _blank; it cannot be a JavaScript expression (for example, it cannot be parent.frameName or windowName.frameName). You can access this value using the target property.
ACTION="serverURL" specifies the URL of the server to which form field input information is sent. This attribute can specify a CGI or LiveWire application on the server; it can also be a mailto: URL if the form is to be mailed. See the location object for a description of the URL components. You can access this value using the action property.
METHOD=GET | POST specifies how information is sent to the server specified by ACTION. GET (the default) appends the input information to the URL, which on most receiving systems becomes the value of the environment variable QUERY_STRING. POST sends the input information in a data body, which is available on stdin with the data length set in the environment variable CONTENT_LENGTH. If the METHOD attribute has the value "POST," then the ENCTYPE attribute typically has the value "application/x-www-form-urlencoded." You can access this value using the method property.
ENCTYPE="encodingType" specifies the MIME encoding of the data sent: "application/x-www-form-urlencoded" (the default) or "multipart/form-data." Use "multipart/form-data" if the form contains a file upload element (INPUT TYPE="file"). If the METHOD attribute has the value "POST," then the ENCTYPE attribute typically has the value "application/x-www-form-urlencoded." You can access this value using the encoding property.
1. formName.propertyName 2. formName.methodName(parameters) 3. forms[index].propertyName 4. forms[index].methodName(parameters)
index is an integer representing a Form object or the name of a Form object as specified by the NAME attribute.
propertyName is one of the properties listed below.
methodName is one of the methods listed below.
You can reference a form's elements in your code by using the element's name (from the NAME attribute) or the elements array. The elements array contains an entry for each element (such as a Checkbox, Radio, or Text object) in a form.
1. document.forms[index] 2. document.forms.lengthindex is an integer representing a form in a document or the name of a Form object as specified by the NAME attribute.
To obtain the number of forms in a document, use the length property: document.forms.length.
You can also refer to a form's elements by using the forms array. For example, you would refer to a Text object named quantity in the second form as document.forms[1].quantity. You would refer to the value property of this Text object as document.forms[1].quantity.value.
Elements in the forms array are read-only. For example, the statement document.forms[0]="music" has no effect.
The value of each element in the forms array is <object nameAttribute>, where nameAttribute is the NAME attribute of the form.
| Property | Description |
|---|---|
| action | Reflects the ACTION attribute |
| elements array | An array reflecting all the elements in a form |
| encoding | Reflects the ENCTYPE attribute |
| length | Reflects the number of elements on a form |
| name | Reflects the NAME attribute |
| method | Reflects the METHOD attribute |
| target | Reflects the TARGET attribute |
The following objects are also properties of the Form object:
|
|
|
The forms array has the following properties:
| Property | Description |
|---|---|
| length | Reflects the number of forms in the document |
|
|
|
<HTML>
<HEAD>
<TITLE>Form object example</TITLE>
</HEAD>
<SCRIPT>
function setCase (caseSpec){
if (caseSpec == "upper") {
document.form1.firstName.value=document.form1.firstName.value.toUpperCase()
document.form1.lastName.value=document.form1.lastName.value.toUpperCase()}
else {
document.form1.firstName.value=document.form1.firstName.value.toLowerCase()
document.form1.lastName.value=document.form1.lastName.value.toLowerCase()}
}
</SCRIPT>
<BODY>
<FORM NAME="form1">
<B>First name:</B>
<INPUT TYPE="text" NAME="firstName" SIZE=20>
<BR><B>Last name:</B>
<INPUT TYPE="text" NAME="lastName" SIZE=20>
<P><INPUT TYPE="button" VALUE="Names to uppercase" NAME="upperButton"
onClick="setCase('upper')">
<INPUT TYPE="button" VALUE="Names to lowercase" NAME="lowerButton"
onClick="setCase('lower')">
</FORM>
</BODY>
</HTML>
Example 2: forms array.
The onLoad event handler in the following example displays the name of
the first form in an Alert dialog box.
<BODY onLoad="alert('You are looking at the ' + document.forms[0] + ' form!')">
If the form name is musicType,
the alert displays the following message:
You are looking at the <object musicType> form!Example 3: onSubmit event handler. The following example shows an onSubmit event handler that determines whether to submit a form. The form contains one Text object where the user enters three characters. The onSubmit event handler calls a function, checkData, that returns true if the number of characters is three; otherwise, it returns false. Notice that the form's onSubmit event handler, not the submit button's onClick event handler, calls the checkData function. Also, the onSubmit event handler contains a return statement that returns the value obtained with the function call.
<HTML>
<HEAD>
<TITLE>Form object/onSubmit event handler example</TITLE>
<TITLE>Form object example</TITLE>
</HEAD>
<SCRIPT>
var dataOK=false
function checkData (){
if (document.form1.threeChar.value.length == 3) {
return true}
else {
alert("Enter exactly three characters. " + document.form1.threeChar.value +
" is not valid.")
return false}
}
</SCRIPT>
<BODY>
<FORM NAME="form1" onSubmit="return checkData()">
<B>Enter 3 characters:</B>
<INPUT TYPE="text" NAME="threeChar" SIZE=3>
<P><INPUT TYPE="submit" VALUE="Done" NAME="submit1"
onClick="document.form1.threeChar.value=document.form1.threeChar.value.toUpperCase()">
</FORM>
</BODY>
</HTML>
Example 4: submit method.
The following example is similar to the previous one, except it submits
the form using the submit method instead of a Submit object.
The form's onSubmit event handler does not prevent the form from being
submitted. The form uses a button's onClick event handler to call the checkData
function. If the value is valid, the checkData function submits
the form by calling the form's submit method.
<HTML>
<HEAD>
<TITLE>Form object/submit method example</TITLE>
</HEAD>
<SCRIPT>
var dataOK=false
function checkData (){
if (document.form1.threeChar.value.length == 3) {
document.form1.submit()}
else {
alert("Enter exactly three characters. " + document.form1.threeChar.value +
" is not valid.")
return false}
}
</SCRIPT>
<BODY>
<FORM NAME="form1" onSubmit="alert('Form is being submitted.')">
<B>Enter 3 characters:</B>
<INPUT TYPE="text" NAME="threeChar" SIZE=3>
<P><INPUT TYPE="button" VALUE="Done" NAME="button1"
onClick="checkData()">
</FORM>
</BODY>
</HTML>
this.form objectReference.form
<FORM NAME="myForm"> Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga"> <P> <INPUT NAME="button1" TYPE="button" VALUE="Show Form Name" onClick="this.form.text1.value=this.form.name"> </FORM>Example 2. The following example shows a form with several elements. When the user clicks button2, the function showElements displays an alert dialog box containing the names of each element on the form myForm.
function showElements(theForm) {
str = "Form Elements of form " + theForm.name + ": \n "
for (i = 0; i < theForm.length; i++)
str += theForm.elements[i].name + "\n"
alert(str)
}
</script>
<FORM NAME="myForm">
Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
onClick="this.form.text1.value=this.form.name">
<INPUT NAME="button2" TYPE="button" VALUE="Show Form Elements"
onClick="showElements(this.form)">
</FORM>
The alert dialog box displays
the following text:
JavaScript Alert: Form Elements of form myForm: text1 button1 button2Example 3. The following example uses an object reference, rather than the this keyword, to refer to a form. The code returns a reference to myForm, which is a form containing myTextObject.
document.myForm.myTextObject.form
history.forward()
<P><INPUT TYPE="button" VALUE="< Back" onClick="history.back()"> <P><INPUT TYPE="button" VALUE="> Forward" onClick="history.forward()">
<FRAMESET ROWS="rowHeightList" COLS="columnWidthList" [onBlur="handlerText"] [onFocus="handlerText"] [onLoad="handlerText"] [onUnload="handlerText"]> <FRAME SRC="URL" NAME="frameName"> [ ... <FRAME SRC="URL" NAME="frameName">] </FRAMESET>
COLS="columnWidthList" is a comma-separated list of values specifying the column-width of the frame. An optional suffix defines the units. Default units are pixels.
SRC="URL" specifies the URL of the document to be displayed in the frame. The URL cannot include an anchor name; for example <FRAME SRC="doc2.html#colors" NAME="frame2"> is invalid. See the location object for a description of the URL components.
NAME="frameName" specifies a name to be used as a target of hyperlink jumps. You can access this value using the name property, and you can use this name when indexing the frames array.
1. [windowReference.]frameName.propertyName 2. [windowReference.]frames[index].propertyName 3. window.propertyName 4. self.propertyName 5. parent.propertyNameTo define an onBlur or onFocus event handler for a frame (for frames, you cannot specify these event handlers in HTML):
1. frameReference.onblur=errorHandler 2. frameReference.onfocus=errorHandler
frameName is the value of the NAME attribute in the <FRAME> tag of a Frame object.
index is an integer representing a Frame object or the name of a Frame object as specified by the NAME attribute.
propertyName is one of the properties listed below.
frameReference is a valid way of referring to a frame.
errorHandler is the keyword null, the name of an error-handling function, or a variable or property that contains null or a valid function reference.
The frames array is a property of both the Frame object and window object.
If a <FRAME> tag contains SRC and NAME attributes, you can refer to that frame from a sibling frame by using parent.frameName or parent.frames[index]. For example, if the fourth frame in a set has NAME="homeFrame," sibling frames can refer to that frame using parent.homeFrame or parent.frames[3].
The self and window properties are synonyms for the current frame, and you can optionally use them to refer to the current frame. You can use these properties to make your code more readable. See the properties listed below for examples.
The top and parent properties are also synonyms that can be used in place of the frame name. top refers to the top-most window that contains frames or nested framesets, and parent refers to the window containing the current frameset. See the top and parent properties.
To create an onBlur or onFocus event handler for a frame, you must set the onblur or onfocus property and specify it in all lowercase (you cannot specify it in HTML).
1. [frameReference.]frames[index] 2. [frameReference.]frames.length 3. [windowReference.]frames[index] 4. [windowReference.]frames.lengthframeReference is a valid way of referring to a frame.
windowReference is a variable windowVar from a window definition (see the window object), or one of the synonyms top or parent.
index is an integer representing a frame in a parent window or the name of a Frame object as specified by the NAME attribute.
To obtain the number of child frames in a window or frame, use the length property:
[windowReference.].frames.length [frameReference.].frames.lengthElements in the frames array are read-only. For example, the statement windowReference.frames[0]="frame1" has no effect.
The value of each element in the frames array is <object nameAttribute>, where nameAttribute is the NAME attribute of the frame.
| Property | Description |
|---|---|
| frames | An array reflecting all the frames in a window |
| name | Reflects the NAME attribute of the <FRAME> tag |
| length | Reflects the number of child frames within a frame |
| parent | A synonym for the window or frame containing the current frameset |
| self | A synonym for the current frame |
| window property | A synonym for the current frame |
The frames array has the following properties:
| Property | Description |
|---|---|
| length | Reflects the number of child frames in the document |
|
|
|
<HTML>
<HEAD>
<TITLE>Frames and Framesets: Window 1</TITLE>
</HEAD>
<FRAMESET ROWS="50%,50%" COLS="40%,60%"
onLoad="alert('Hello, World.')">
<FRAME SRC=framcon1.html NAME="frame1">
<FRAME SRC=framcon2.html NAME="frame2">
<FRAME SRC=framcon2.html NAME="frame3">
<FRAME SRC=framcon2.html NAME="frame4">
</FRAMESET>
</HTML>
framset2.html, which
defines the frames for the second window, contains the following code:
<HTML> <HEAD> <TITLE>Frames and Framesets: Window 2</TITLE> </HEAD> <FRAMESET ROWS="50%,50%" COLS="40%,60%"> <FRAME SRC=framcon2.html NAME="frame1"> <FRAME SRC=framcon2.html NAME="frame2"> <FRAME SRC=framcon2.html NAME="frame3"> <FRAME SRC=framcon2.html NAME="frame4"> </FRAMESET> </HTML>framcon1.html, which defines the content for the first frame in the first window, contains the following code:
<HTML>
<BODY>
<A NAME="frame1"><H1>Frame1</H1></A>
<P><A HREF="framcon3.htm" target=frame2>Click here</A>
to load a different file into frame 2.
<SCRIPT>
window2=open("framset2.htm","secondFrameset")
</SCRIPT>
<FORM>
<P><INPUT TYPE="button" VALUE="Change frame2 to teal"
onClick="parent.frame2.document.bgColor='teal'">
<P><INPUT TYPE="button" VALUE="Change frame3 to slateblue"
onClick="parent.frames[2].document.bgColor='slateblue'">
<P><INPUT TYPE="button" VALUE="Change frame4 to darkturquoise"
onClick="top.frames[3].document.bgColor='darkturquoise'">
<P><INPUT TYPE="button" VALUE="window2.frame2 to violet"
onClick="window2.frame2.document.bgColor='violet'">
<P><INPUT TYPE="button" VALUE="window2.frame3 to fuchsia"
onClick="window2.frames[2].document.bgColor='fuchsia'">
<P><INPUT TYPE="button" VALUE="window2.frame4 to deeppink"
onClick="window2.frames[3].document.bgColor='deeppink'">
</FORM>
</BODY>
</HTML>
framcon2.html, which
defines the content for the remaining frames, contains the following code:
<HTML> <BODY> <P>This is a frame. </BODY> </HTML>framcon3.html, which is referenced in a Link object in framcon1.html, contains the following code:
<HTML> <BODY> <P>This is a frame. What do you think? </BODY> </HTML>
functionObjectName = new Function ([arg1, arg2, ... argn], functionBody)To use a Function object:
functionObjectName.propertyName
arg1, arg2, ... argn are arguments to be used by the function as formal argument names. Each must be a string that corresponds to a valid JavaScript identifier; for example "x" or "theForm".
functionBody is a string specifying the JavaScript code to be compiled as the function body.
propertyName is one of the properties listed below.
In addition to defining functions as described here, you can also use the function statement, as described in "function".
var setBGColor = new Function("document.bgColor='antiquewhite'")
To call the Function object,
you can specify the variable name as if it were a function. The following
code executes the function specified by the setBGColor variable:
var colorChoice="antiquewhite"
if (colorChoice=="antiquewhite") {setBGColor()}
You can assign the function to
an event handler in either of the following ways:
1. document.form1.colorButton.onclick=setBGColor 2. <INPUT NAME="colorButton" TYPE="button" VALUE="Change background color" onClick="setBGColor()">Creating the variable setBGColor shown above is similar to declaring the following function:
function setBGColor() {
document.bgColor='antiquewhite'
}
Assigning a function to a variable
is similar to declaring a function, but they have differences:
var multFun = new Function("x", "y", "return x * y")
The string arguments "x" and
"y" are formal argument names that are used in the function body, "return
x * y".
The following code shows several ways to call the function multFun:
var theAnswer = multFun(7,6)
document.write("15*2 = " + multFun(15,2))
<INPUT NAME="operand1" TYPE="text" VALUE="5" SIZE=5>
<INPUT NAME="operand2" TYPE="text" VALUE="6" SIZE=5>
<INPUT NAME="result" TYPE="text" VALUE="" SIZE=10>
<INPUT NAME="buttonM" TYPE="button" VALUE="Multiply"
onClick="document.form1.result.value=
multFun(document.form1.operand1.value,
document.form1.operand2.value)">
You cannot call the function
multFun in an object's event handler property, because event handler
properties cannot take arguments. For example, you cannot call the function
multFun by setting a button's onclick property as follows:
document.form1.button1.onclick=multFun(5,10)
window.onfocus = new Function("document.bgColor='antiquewhite'")
Once you have a reference to
a function object, you can use it like a function and it will convert from
an object to a function:
window.onfocus()Event handlers do not take arguments, so you cannot declare any arguments in the Function() constructor for an event handler.
| Property | Description |
|---|---|
| arguments array | Corresponds to elements of a function. |
| caller | Specifies which function called the current function |
| prototype | Lets you add a properties to a Function object. |
frames[0].onfocus = new Function("document.bgColor='antiquewhite'")
frames[0].onblur = new Function("document.bgColor='lightgrey'")
Example 2. You can determine
whether a function exists by comparing the function name to null. In the
following example, func1 is called if the function noFunc
does not exist; otherwise func2 is called. Notice that the window
name is needed when referring to the function name noFunc.
if (window.noFunc == null) func1() else func2()
dateObjectName.getDate()
Xmas95 = new Date("December 25, 1995 23:15:00")
day = Xmas95.getDate()
dateObjectName.getDay()
Xmas95 = new Date("December 25, 1995 23:15:00")
weekday = Xmas95.getDay()
dateObjectName.getHours()
Xmas95 = new Date("December 25, 1995 23:15:00")
hours = Xmas95.getHours()
dateObjectName.getMinutes()
Xmas95 = new Date("December 25, 1995 23:15:00")
minutes = Xmas95.getMinutes()
dateObjectName.getMonth()
Xmas95 = new Date("December 25, 1995 23:15:00")
month = Xmas95.getDate()
dateObjectName.getSeconds()
Xmas95 = new Date("December 25, 1995 23:15:30")
secs = Xmas95.getSeconds()
dateObjectName.getTime()
theBigDay = new Date("July 1, 1999")
sameAsBigDay = new Date()
sameAsBigDay.setTime(theBigDay.getTime())
dateObjectName.getTimezoneOffset()
x = new Date() currentTimeZoneOffsetInHours = x.getTimezoneOffset()/60
dateObjectName.getYear()
Xmas95 = new Date("December 25, 1995 23:15:00")
year = Xmas95.getYear()
Example 2. The second
statement below assigns the value 2026 to the variable theYear,
based on the value of the Date object newYears2026.
newYears2026 = new Date("2026, January, 1")
theYear = newYears2026.getYear()
history.go(delta | "location")
location is a string or a property of an existing object, representing all or part of a URL in the history list.
The delta argument is a positive or negative integer. If delta is greater than zero, the go method loads the URL that is that number of entries forward in the history list; otherwise, it loads the URL that is that number of entries backward in the history list. If delta is zero, Navigator reloads the current page.
The location argument is a string. Use location to load the nearest history entry whose URL contains location as a substring. The location to URL matching is case-insensitive. Each section of a URL contains different information. See the location object for a description of the URL components.
The go method creates a new entry in the history list. To load a URL without creating an entry in the history list, use replace.
<P><INPUT TYPE="button" VALUE="Go"
onClick="history.go('home.netscape.com')">
The following button navigates
to the URL that is three entries backward in the history list:
<P><INPUT TYPE="button" VALUE="Go" onClick="history.go(-3)">