The following objects, methods, properties, and event handlers are available in JavaScript:
Returns the absolute value of a number.
Math.abs(number)
number is any numeric expression or a property of an existing object.
In the following example, the user enters a number in the first text box and presses the Calculate button to display the absolute value of the number.
<FORM> <P>Enter a number: <INPUT TYPE="text" NAME="absEntry"> <P>The absolute value is: <INPUT TYPE="text" NAME="result"> <P> <INPUT TYPE="button" VALUE="Calculate" onClick="form.result.value = Math.abs(form.absEntry.value)"> </FORM>
Returns the arc cosine (in radians) of a number.
Math.acos(number)
number is a numeric expression between -1 and 1, or a property of an existing object.
The acos method returns a numeric value between 0 and pi radians. If the value of number is outside the suggested range, the return value is always 0.
// Displays the value 0
document.write("The arc cosine of 1 is " + Math.acos(1))
// Displays the value 3.141592653589793
document.write("<P>The arc cosine of -1 is " + Math.acos(-1))
// Displays the value 0
document.write("<P>The arc cosine of 2 is " + Math.acos(2))
A string specifying a destination URL for form data that is submitted.
formName.action
formName is either the name of a form or an element in the forms array.
The action property is a reflection of the ACTION attribute of the <FORM> tag. Each section of a URL contains different information. See the location object for a description of the URL components.
You can set the action property at any time.
Certain values of the action property may require specific values for other form properties. See RFC 1867 for more information.
The following example sets the action property of the musicForm form to the value of the variable urlName:
document.musicForm.action=urlName
Displays an Alert dialog box with a message and an OK button.
alert("message")
message is any string or a property of an existing object.
Use the alert method to display a message that does not require a user decision. The message argument specifies a message that the dialog box contains.
Although alert is a method of the window object, you do not need to specify a windowReference when you call it. For example, windowReference.alert() is unnecessary.
In the following example, the testValue() function checks the name entered by a user in the text object of a form to make sure that it is no more than eight characters in length. This example uses the alert method to prompt the user to enter a valid value.
function testValue(textElement) {
if (textElement.length > 8) {
alert("Please enter a name that is 8 characters or less")
}
}
You can call the testValue() function in the onBlur event handler of a form's text object, as shown in the following example:
Name: <INPUT TYPE="text" NAME="userName" onBlur="testValue(userName.value)">
A string specifying the color of an active link (after mouse-button down, but before mouse-button up).
document.alinkColor
The alinkColor property is expressed as a hexadecimal RGB triplet or as one of the string literals listed in Color Values. This property is the JavaScript reflection of the ALINK attribute of the <BODY> tag. You cannot set this property after the HTML source has been through layout.
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".
The following example sets the color of active links to aqua using a string literal:
document.alinkColor="aqua"
The following example sets the color of active links to aqua using a hexadecimal triplet:
document.alinkColor="00FFFF"
Creates an HTML anchor that is used as a hypertext target.
text.anchor(nameAttribute)
text is any string or a property of an existing object.
nameAttribute is any string or a property of an existing object.
Use the anchor method with the write or writeln methods to programatically create and display an anchor in a document. Create the anchor with the anchor method, then call write or writeln to display the anchor in a document.
In the syntax, the text string represents the literal text that you want the user to see. The nameAttribute string represents the NAME attribute of the <A> tag.
Anchors created with the anchor method become elements in the anchors array. See the anchor object for information about the anchors array.
The following example opens the msgWindow window and creates an anchor for the Table of Contents:
The previous example produces the same output as the following HTML:
A piece of text that can be the target of a hypertext link.
To define an anchor, use standard HTML syntax:
<A [HREF=locationOrURL] NAME="anchorName" [TARGET="windowName"]> anchorText </A>HREF=locationOrURL identifies a destination anchor or URL. If this attribute is present, the anchor object is also a link object. See link for details.
You can also define an anchor using the anchor method.
If an anchor object is also a link object, the object has entries in both the anchors and links arrays.
You can reference the anchor objects in your code by using the anchors array. This array contains an entry for each <A> tag containing a NAME attribute in a document in source order. For example, if a document contains three named anchors, these anchors are reflected as document.anchors[0], document.anchors[1], and document.anchors[2].
To use the anchors array:
1. document.anchors[index] 2. document.anchors.length
index is an integer representing an anchor in a document.
To obtain the number of anchors in a document, use the length property: document.anchors.length.
Even though the anchors array represents named anchors, the value of anchors[index] is always null. But if a document names anchors in a systematic way using natural numbers, you can use the anchors array and its length property to validate an anchor name before using it in operations such as setting location.hash. See the example below.
Elements in the anchors array are read-only. For example, the statement document.anchors[0]="anchor1" has no effect.
The anchors object has no properties. The anchors array has the following properties:
Example 1: an anchor. The following example defines an anchor for the text "Welcome to JavaScript".
If the preceding anchor is in a file called intro.html, a link in another file could define a jump to the anchor as follows:
Example 2: anchors array. The following example opens two windows. The first window contains a series of buttons that set location.hash in the second window to a specific anchor. The second window defines four anchors named "0", "1", "2", and "3". (The anchor names in the document are therefore 0, 1, 2, ... (document.anchors.length-1)). When a button is pressed in the first window, the onClick event handler verifies that the anchor exists before setting window2.location.hash to the specified anchor name.
LINK1.HTML, which defines the first window and its buttons, contains the following code:
LINK2.HTML, which contains the anchors, contains the following code:
An array of objects corresponding to named anchors in source order. See anchor object.
A string specifying the code name of the browser.
navigator.appCodeName
appCodeName is a read-only property.
The following example displays the value of the appCodeName property:
document.write("The value of navigator.appCodeName is " +
navigator.appCodeName)
For Navigator 2.0, this displays the following:
The value of navigator.appCodeName is Mozilla
A string specifying the name of the browser.
navigator.appName
appName is a read-only property.
The following example displays the value of the appName property:
document.write("The value of navigator.appName is " +
navigator.appName)
For Navigator 2.0, this displays the following:
The value of navigator.appName is Netscape
A string specifying version information for the Navigator.
navigator.appVersion
The appVersion property specifies version information in the following format:
releaseNumber (platform; country)
The values contained in this format are the following:
appVersion is a read-only property.
Example 1. The following example displays version information for the Navigator:
document.write("The value of navigator.appVersion is " +
navigator.appVersion)
For Navigator 2.0 on Windows 95, this displays the following:
The value of navigator.appVersion is 2.0 (Win95, I)
Example 2. The following example populates a textarea object with newline characters separating each line. Because the newline character varies from platform to platform, the example tests the appVersion property to determine whether the user is running Windows (appVersion contains "Win" for all versions of Windows). If the user is running Windows, the newline character is set to \r\n; otherwise, it's set to \n, which is the newline character for Unix and Macintosh.
Returns the arc sine (in radians) of a number.
Math.asin(number)
number is a numeric expression between -1 and 1, or a property of an existing object.
The asin method returns a numeric value between -pi/2 and pi/2 radians. If the value of number is outside the suggested range, the return value is always 0.
// Displays the value 1.570796326794897 (pi/2)
document.write("The arc sine of 1 is " + Math.asin(1))
// Displays the value -1.570796326794897 (-pi/2)
document.write("<P>The arc sine of -1 is " + Math.asin(-1))
// Displays the value 0 because the argument is out of range
document.write("<P>The arc sine of 2 is " + Math.asin(2))
Returns the arc tangent (in radians) of a number.
Math.atan(number)
number is either a numeric expression or a property of an existing object, representing the tangent of an angle.
The atan method returns a numeric value between -pi/2 and pi/2 radians.
// Displays the value 0.7853981633974483
document.write("The arc tangent of 1 is " + Math.atan(1))
// Displays the value -0.7853981633974483
document.write("<P>The arc tangent of -1 is " + Math.atan(-1))
// Displays the value 0.4636476090008061
document.write("<P>The arc tangent of .5 is " + Math.atan(.5))
Loads the previous URL in the history list.
history.back()
This method performs the same action as a user choosing the Back button in the Navigator. The back method is the same as history.go(-1).
<P><INPUT TYPE="button" VALUE="< Back" onClick="history.back()"> <P><INPUT TYPE="button" VALUE="> Forward" onClick="history.forward()">
A string specifying the color of the document background.
document.bgColor
The bgColor property is expressed as a hexadecimal RGB triplet or as one of the string literals listed in Color Values. This property is the JavaScript reflection of the BGCOLOR attribute of the <BODY> tag. The default value of this property is set by the user on the Colors tab of the Preferences dialog box, which is displayed by choosing General Preferences from the Options menu.
You can set the bgColor property at any time.
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".
The following example sets the color of the document background to aqua using a string literal:
document.bgColor="aqua"
The following example sets the color of the document background to aqua using a hexadecimal triplet:
document.bgColor="00FFFF"
Causes a string to be displayed in a big font as if it were in a <BIG> tag.
stringName.big()
stringName is any string or a property of an existing object.
Use the big method with the write or writeln methods to format and display a string in a document.
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:
Causes a string to blink as if it were in a <BLINK> tag.
stringName.blink()
stringName is any string or a property of an existing object.
Use the blink method with the write or writeln methods to format and display a string in a document.
var worldString="Hello, world"
document.write(worldString.blink())
document.write("<P>" + worldString.bold())
document.write("<P>" + worldString.italics())
document.write("<P>" + worldString.strike())
The previous example produces the same output as the following HTML:
Removes focus from the specified object.
1. passwordName.blur() 2. selectName.blur() 3. textName.blur() 4. textareaName.blur()
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.
password, select, text, textarea
Use the blur method to remove focus from a specific form element.
The following example removes focus from the password element userPass:
userPass.blur()This example assumes that the password is defined as:
<INPUT TYPE="password" NAME="userPass">
Causes a string to be displayed as bold as if it were in a <B> tag.
stringName.bold()
stringName is any string or a property of an existing object.
Use the bold method with the write or writeln methods to format and display a string in a document.
var worldString="Hello, world"
document.write(worldString.blink())
document.write("<P>" + worldString.bold())
document.write("<P>" + worldString.italics())
document.write("<P>" + worldString.strike())
The previous example produces the same output as the following HTML:
<BLINK>Hello, world</BLINK> <P><B>Hello, world</B> <P><I>Hello, world</I> <P><STRIKE>Hello, world</STRIKE>
A pushbutton on an HTML form.
To define a button:
<INPUT TYPE="button" NAME="buttonName" VALUE="buttonText" [onClick="handlerText"]>NAME="buttonName" specifies the name of the button object. You can access this value using the name property.
To use a button object's properties and methods:
1. buttonName.propertyName 2. buttonName.methodName(parameters) 3. formName.elements[index].propertyName 4. formName.elements[index].methodName(parameters)buttonName is the value of the NAME attribute of a button object.
A button object on a form looks as follows:
A button object is a form element and must be defined within a <FORM> tag.
The button object is a custom button that you can use to perform an action you define. The button executes the script specified by its onClick event handler.
The following example creates a button named calcButton. The text "Calculate" is displayed on the face of the button. When the button is clicked, the function calcFunction() is called.
Returns the least integer greater than or equal to a number.
Math.ceil(number)
number is any numeric expression or a property of an existing object.
//Displays the value 46
document.write("The ceil of 45.95 is " + Math.ceil(45.95))
//Displays the value -45
document.write("<P>The ceil of -45.95 is " + Math.ceil(-45.95))
Returns the character at the specified index.
stringName.charAt(index)
stringName is any string or a property of an existing object.
index is any integer from 0 to stringName.length - 1, or a property of an existing object.
Characters in a string are indexed from left to right. The index of the first character is 0, and the index of the last character is stringName.length - 1. If the index you supply is out of range, JavaScript returns an empty string.
var anyString="Brave new world"
document.write("The character at index 0 is " + anyString.charAt(0))
document.write("The character at index 1 is " + anyString.charAt(1))
document.write("The character at index 2 is " + anyString.charAt(2))
document.write("The character at index 3 is " + anyString.charAt(3))
document.write("The character at index 4 is " + anyString.charAt(4))
A checkbox on an HTML form. A checkbox is a toggle switch that lets the user set a value on or off.
To define a checkbox, use standard HTML syntax with the addition of the onClick event handler:
<INPUT TYPE="checkbox" NAME="checkboxName" VALUE="checkboxValue" [CHECKED] [onClick="handlerText"]> textToDisplayNAME="checkboxName" specifies the name of the checkbox object. You can access this value using the name property.
To use a checkbox object's properties and methods:
1. checkboxName.propertyName 2. checkboxName.methodName(parameters) 3. formName.elements[index].propertyName 4. formName.elements[index].methodName(parameters)checkboxName is the value of the NAME attribute of a checkbox object.
A checkbox object on a form looks as follows:
A checkbox object is a form element and must be defined within a <FORM> tag.
Use the checked property to specify whether the checkbox is currently checked. Use the defaultChecked property to specify whether the checkbox is checked when the form is loaded.
Example 1. The following example displays a group of four checkboxes that all appear checked by default.
Example 2. The following example contains a form with three text boxes and one checkbox. The checkbox lets the user choose whether the text fields are converted to upper case. Each text field has an onChange event handler that converts the field value to upper case if the checkbox is checked. The checkbox has an onClick event handler that converts all fields to upper case when the user checks the checkbox.
A Boolean value specifying the selection state of a checkbox object or radio button.
1. checkboxName.checked 2. radioName[index].checked
checkboxName is either the value of the NAME attribute of a checkbox object or an element in the elements array.
radioName is the value of the NAME attribute of a radio object.
index is an integer representing a radio button in a radio object.
If a checkbox or radio button is selected, the value of its checked property is true; otherwise, it is false.
You can set the checked property at any time. The display of the checkbox or radio button updates immediately when you set the checked property.
The following example examines an array of radio buttons called musicType on the musicForm form to determine which button is selected. The VALUE attribute of the selected button is assigned to the checkedButton variable.
function stateChecker() {
var checkedButton = ""
for (var i in document.musicForm.musicType) {
if (document.musicForm.musicType[i].checked=="1") {
checkedButton=document.musicForm.musicType[i].value
}
}
}
Clears the document in a window.
document.clear()
The clear method empties the content of a window, regardless of how the content of the window has been painted.
When the following function is called, the clear method empties the contents of the msgWindow window:
function windowCleaner() {
msgWindow.document.clear()
msgWindow.document.close()
}
Cancels a timeout that was set with the setTimeout method.
clearTimeout(timeoutID)
timeoutID is a timeout setting that was returned by a previous call to the setTimeout method.
See the description for the setTimeout method.
See the examples for the setTimeout method.
Simulates a mouse click on the calling form element.
1. buttonName.click() 2. radioName[index].click()
3. checkboxName.click()
buttonName is either the value of the NAME attribute of a button, reset, or submit object or an element in the elements array.
radioName is the value of the NAME attribute of a radio object or an element in the elements array.
index is an integer representing a radio button in a radio object.
checkboxName is either the value of the NAME attribute of a checkbox object or an element in the elements array.
button, checkbox, radio, reset, submit
The effect of the click method varies according to the calling element:
The following example toggles the selection status of the first radio button in the musicType radio object on the musicForm form:
document.musicForm.musicType[0].click()
The following example toggles the selection status of the newAge checkbox on the musicForm form:
document.musicForm.newAge.click()
Closes an output stream and forces data sent to layout to display.
document.close()
The close method closes a stream opened with the document.open() method. If the stream was opened to layout, the close method forces the content of the stream to display. Font style tags, such as <BIG> and <CENTER>, automatically flush a layout stream.
The close method also stops the "meteor shower" in the Netscape icon and displays "Document: Done" in the status bar.
function windowWriter1() {
var myString = "Hello, world!"
msgWindow.document.open()
msgWindow.document.write(myString + "<P>")
msgWindow.document.close()
}
Closes the specified window.
windowReference.close()
windowReference is a valid way of referring to a window, as described in the window object.
The close method closes the specified window. If you call close without specifying a windowReference, JavaScript closes the current window.
In event handlers, you must specify window.close() instead of simply using close(). Due to the scoping of static objects in JavaScript, a call to close() without specifying an object name is equivalent to document.close().
Any of the following examples close the current window:
window.close() self.close() close()
The following example closes the messageWin window:
messageWin.close()
This example assumes that the window was opened in a manner similar to the following:
messageWin=window.open("")
Displays a Confirm dialog box with the specified message and OK and Cancel buttons.
confirm("message")
message is any string or a property of an existing object.
Use the confirm method to ask the user to make a decision that requires either an OK or a Cancel. The message argument specifies a message that prompts the user for the decision. The confirm method returns true if the user chooses OK and false if the user chooses Cancel.
Although confirm is a method of the window object, you do not need to specify a windowReference when you call it. For example, windowReference.confirm() is unnecessary.
This example uses the confirm method in the confirmCleanUp() function to confirm that the user of an application really wants to quit. If the user chooses OK, the custom cleanUp() function closes the application.
function confirmCleanUp() {
if (confirm("Are you sure you want to quit this application?")) {
cleanUp()
}
}
You can call the confirmCleanUp() function in the onClick event handler of a form's pushbutton, as shown in the following example:
<INPUT TYPE="button" VALUE="Quit" onClick="confirmCleanUp()">
String value of a cookie, which is a small piece of information stored by the Navigator in the cookies.txt file.
document.cookie
Use string methods such as substring, charAt, indexOf, and lastIndexOf to determine the value stored in the cookie. See the Netscape cookie specification for a complete specification of the cookie syntax.
You can set the cookie property at any time.
The following function uses the cookie property to record a reminder for users of an application. The "expires=" component sets an expiration date for the cookie, so it persists beyond the current browser session. The format of the date must be
Wdy, DD-Mon-YY HH:MM:SS GMTwhere Wdy is the full name of the day of the week, DD is an integer representation of the day of the month, Mon is the month, YY is the last two digits of the year, and HH, MM, and SS are two-digit representations of hours, minutes, and seconds, respectively.
This is the same date format as returned by Date.toGMTString, except:
For example, a valid cookie expiration date is:
expires=Wednesday, 09-Nov-99 23:12:40 GMT
function RecordReminder(time, expression) {
// Record a cookie of the form "@=" to map
// from in milliseconds since the epoch,
// returned by Date.getTime(), onto an encoded expression,
// (encoded to contain no white space, semicolon,
// or comma characters)
document.cookie = "@" + time + "=" + expression + ";"
// set the cookie expiration time to one day
// beyond the reminder time
document.cookie += "expires=" + cookieDate(time + 24*60*60*1000)
// cookieDate is a function that formats the date according to the cookie spec
}
When the user loads the page that contains this function, another function uses indexOf("@") and indexOf("=") to determine the date and time stored in the cookie.
Returns the cosine of a number.
Math.cos(number)
number is a numeric expression representing the size of an angle in radians, or a property of an existing object.
The cos method returns a numeric value between -1 and 1, which represents the cosine of the angle.
//Displays the value 6.123031769111886e-017
document.write("The cosine of PI/2 radians is " + Math.cos(Math.PI/2))
//Displays the value -1
document.write("<P>The cosine of PI radians is " + Math.cos(Math.PI))
//Displays the value 1
document.write("<P>The cosine of 0 radians is " + Math.cos(0))