JavaScript
location
ObjectThe location object contains information on the current document's URL.
Syntax
The syntax for this object is
[windowReference.]location[.propertyName]
where propertyName is one of the properties for the location object as listed in the following "Properties" section. Omitting the property name is equivalent to specifying the href property (the complete URL). The optional windowReference is a window name as defined by a var x = window.open(...) statement or one of the synonyms top or parent..
Properties
Most properties of the location object represent a different portion of the URL, in the general order of
protocol//hostname:port pathname search hash
The full set of properties is summarized here:
.hash Specifies an anchor name in the URL.
.host Specifies the hostname:port portion of the URL.
.hostname Specifies the host and domain name, or IP address, of a network host.
.href Specifies the entire URL.
.pathname Specifies the URL-path portion of the URL.
.port Specifies the communications port that the server uses for communications.
.protocol Specifies the beginning of the URL, including the colon.
.search Specifies a query.
Description
The location object represents the Location window in the browser window. Initially, its value is equal to the complete URL of the current document. But unlike the location property, which just returns the URL, the location object can be changed programmatically to display a new page in the window or frame.
The location object is contained by the window object. In a framed site, each frame has its own unique location object, which is the URL of the page being displayed within that frame (window). If you reference a location object without specifying a window, the location object represents the current location. If you reference a location object and specify a window name (for example, windowReference.location.propertyName) the location object represents the location of the specified window.
The location object is a property of the larger window object.
Example
The sample Web page that follows contains an anchor (bookmark) named Top just after the opening body tag. Near the bottom of the page is a button labeled Return to top of page. that, when clicked, adds the hash #Top to the Location box. When your readers click the button, they are taken back to the top of the page:
<HTML>
<BODY>
<A NAME = "Top"></A>
<H1><CENTER>I Have a Top</H1></CENTER>
Scroll down to bottom of this page to find a button
<SCRIPT Language = "JavaScript">
for (var i=1; i<=40;i++) {
document.write ("keep going<p>")
}
</SCRIPT>
<FORM name="mini1">
<CENTER>
<INPUT type="button" value="Return to top of page." onClick = "self.location.hash = 'Top'">
</CENTER>
</FORM>
</BODY>
</HTML>
Math
ObjectThe math object is a built-in object that has properties and methods for mathematical constants and functions.
Syntax
To use a Math object, follow the syntax
Math.propertyName
or
Math.methodName(parameters)
where propertyName is one of the properties of the Math object, methodName is one of the methods of the Match object, and parameters are appropriate values for the method.
Properties
.E Euler's constant (approximately 2.718).
.LN2 The natural logarithm of 2 (approximately 0.693).
.LN10 The natural logarithm of 10 (approximately 2.302).
.LOG2E The base 2 logarithm of e (approximately 1.442).
.LOG10E The base 10 logarithm of e (approximately 0.434).
.PI The ratio of the circumference of a circle to its diameter (approximately 3.14159).
.SQRT1_2 The square root of one-half; equivalently, one over the square root of two (approximately 0.707)
.SQRT2 The square root of 2 (approximately 1.414).
Methods
.abs(n) Returns the absolute value of n.
.acos (n) Returns the arcosine (in radians) of n.
.asin(n) Returns the arcsine (in radians) of n.
.atan(n) Returns the arc tangent (in radians) of n.
.ceil(n) Returns the least integer greater than or equal to n.
.cos(n) Returns the cosine of n.
.exp(n) Returns e n, where n is the argument and e is Euler's constant.
.floor(n) Returns the greatest integer less than or equal to n.
.log(n) Returns the natural logarithm (base e) of n.
.max(x,y) Returns either x or y, whichever is greater.
.min (x,y) Returns either x or y, whichever is smaller.
.pow(x,y) returns x to the exponent power, that is, xy.
.random() Returns a random number between 0 and 1 (Unix only).
.round(n) Returns the value of a n rounded to the nearest integer.
.sin(n) Returns the sine of n.
.sqrt(n) Returns the square root of n.
.tan(n) Returns the tangent of n.
Description
The Math object is a built-in JavaScript object. (Note the use of the uppercase M in Math and the use of uppercase letters in all properties.)
Example
Because the random() method doesn't work in Windows, you can create a custom randnum() function that returns a random number. The following Web page shows the randnum() function and includes a small form and button to test the custom function:
<HTML>
<HEAD>
<SCRIPT language = "JavaScript">
function randnum(lowest,highest) {
retval = 0
while ((retval < lowest) || (retval > highest)) {
now = new Date()
retval = Math.abs(Math.sin(now.getTime()))
retval = parseInt(retval * (highest+1))
}
return retval
}
</SCRIPT>
</HEAD>
<BODY>
Let's test the random number custom function, using numbers between 1 and 10.<P>
<FORM name="testForm">
<INPUT name = "randomnum" size = 3"><P>
<INPUT type="button" value = "Click for random number"onclick =
"document.testForm.randomnum.value = randnum(1,10)">
</FORM>
</BODY>
</HRML>
navigator
ObjectThe navigator object contains information about the version of Netscape Navigator in use.
Syntax
The syntax for this object is
navigator.propertyName
where propertyName is one of the properties of the navigator object listed in the next section.
Properties
.appCodeName Returns the code name of the browser.
.appName Returns the name of the browser.
.appVersion Returns the version information for Navigator.
.userAgent Specifies the user-agent header.
Description
You can use the navigator object to determine information about which version of Netscape Navigator your reader is currently using.
Example
Opening this page with Netscape Navigator Gold:
<HTML>
<BODY>
<CENTER>
<SCRIPT Language = "JavaScript">
document.write ("I see you're using <b>")
document.write (navigator.appName," ",navigator.appVersion)
document.write ("</b> aka ",navigator.appCodeName,". ")
document.write ("That's cool!")
</SCRIPT>
</CENTER>
</BODY>
</HTML>causes the following message to display on the screen:
I see you're using Netscape 2.01 Gold (Mac68K; I) aka Mozilla. That's cool!
password
ObjectIn a form, a password object is a text field that hides the reader's entry by displaying an asterisk (*) for each character typed.
Syntax
To create a password object, use Insert > Form Field > Text > Password. To create a password field manually, place an <INPUT type='password'...> tag between a pair of <FORM>...</FORM> tags.
To refer to a password object's properties and methods via JavaScript code, use any of these syntaxes:
passwordName.propertyName
passwordName.methodName(parameters)
formName.elements[index].propertyName
formName.elements[index].methodName(parameters)
where passwordName is the NAME attribute as defined in the password object's <INPUT> tag, formName is either the NAME attribute as defined in the <FORM> tag, or an element in the forms array, index is an integer representing the password field's position in the elements array, propertyName and methodName are any valid property/method for the password object, as listed in the next section, and parameters are any parameters that are acceptable to the method.
Properties
.defaultValue Reflects the VALUE attribute as defined in the <INPUT> tag.
.name Reflects the NAME attribute as defined in the <INPUT> tag.
.value Reflects the VALUE attribute is set programmatically, but not a user's entry.
Methods
.focus() Moves the insertion point into the password field.
.blur() Moves the focus out of the password field so nothing can be typed there.
.select() Selects the contents of the password field.
Description
A password object is a form element that must be defined with an <INPUT> tag between a pair of <FORM>...</FORM> tags. The password object is a property of the larger form object.
Example
Even though there appears to be no way to test or validate a user's entry in a password field (a possible bug), you can still create a password field using password in an input tag, as in the following example shows:
<FORM>
<INPUT TYPE="password" NAME="ReaderPassword"VALUE="" MAXLENGTH="16" SIZE=16 >
</FORM>
radio
ObjectThe radio object is a single radio button (aka option button) on a form.
Syntax
You can choose Insert > Form Field > Radio Button Group to create a group of radio buttons on a form. Or, you can manually enter <INPUT type='radio'...> tags between a pair of <FORM>...</FORM> tags.
To access a radio button's properties and methods via JavaScript, use any of these syntaxes:
radioName[index1].propertyName
radioName[index1].methodName(parameters)
formName.elements[index2].propertyName
formName.elements[index2].methodName(parameters)
where radioName is the NAME attribute as defined in the <INPUT> tag, index1 is an integer representing a radio button in a radio group, formName is either the NAME attribute of a form object or an element in the forms array, index2 is an integer representing a radio button on a form. The elements array contains an entry for each radio button in a radio object. The propertyName, methodName, and parameters represent any of the valid properties/methods/parameters for the radio object, as listed in the following sections.
Properties
.checked Lets you see if a button is selected and programatically select a radio button.
.default Reflects the CHECKED attribute of the button's <INPUT> tag.
.length Reflects the number of radio buttons in a radio button group.
.name Reflects the NAME attribute as defined in the button's <INPUT> tag.
.value Reflects the VALUE attribute as defined in the button's <INPUT> tag.
Methods
.click() Programatically clicks on the radio button.
Event Handlers
onClick Triggered when the reader clicks on the radio button.
Description
All of the radio buttons in a radio button group use the same name property. To access the an individual radio button via JavaaScript, follow the object name with an index starting from 0, indicating the button's position in the group. But be aware that (for some totally counterintuitive reason) the items are numbered backwards. For example, take a look at the radio buttons defined in the following form:
<FORM name = "flashy">
<INPUT TYPE="RADIO" NAME="flashers" VALUE="first">first
<INPUT TYPE="RADIO" NAME="flashers" VALUE="second">second
<INPUT TYPE="RADIO" NAME="flashers" VALUE="third">third
<INPUT TYPE="RADIO" NAME="flashers" VALUE="fourth">fourth
<INPUT TYPE="RADIO" NAME="flashers" VALUE="fifth">fifth
</FORM>
(By the way, document.flashy.flashers[0].value returns fifth, document.flashy.flashers[1].value returns fourth and document.flashy.flashers[4].value returns first.)
The radio object is a property of the larger form object.
Example
Opening the sample Web page that follows shows a simple form with two checkboxes, one labeled Female, the other labeled Male. Below the checkboxes appears a button labeled "Click Me":
<HTML>
<HEAD>
<SCRIPT Language = "JavaScript">
function showChoice() {
var msg = ""
if (document.ReaderInfo.gender[1].checked) {
msg = 'Female'
}
if (document.ReaderInfo.gender[0].checked) {
msg = 'Male'
}
alert ("You chose "+msg)
}
</SCRIPT>
</HEAD>
<BODY>
<FORM name = "ReaderInfo">
<INPUT TYPE="RADIO" NAME="gender" VALUE="Female">Female<BR>
<INPUT TYPE="RADIO" NAME="gender" VALUE="Male">Male<BR><P>
<INPUT type="button" value="Click Me" onClick="showChoice()">
</FORM>
</BODY>
</HTML>When readers click on the button, an alert message shows which choice they made in the radio buttons. The showMessage() custom function determines which choice was made by inspecting the .checked property of each radio button and assigning a value to the variable named msg when it finds the checked button. The alert() property just shows that message on the screen.
reset
ObjectThe reset object refers to the Reset button on a form.
Syntax
To define a Reset button on a form, use the standard HTML <INPUT> tag with the type attribute set to Reset. You can add an onClick handler to trigger some JavaScript code when the user clicks the Reset button.
To access a Reset button's properties and methods from JavaScript, use any or these syntaxes:
resetName.propertyName
resetName.methodName(parameters)
formName.elements[index].propertyName
formName.elements[index].methodName(parameters)
where resetName is the NAME attribute as defined in the button's <INPUT> tag, formName is the name of the form as defined in the NAME attribute of the <FORM> tag (or an element in the forms array), index is an integer representing the reset button's position in the forms array, and propertyName, methodName, and parameters is any valid property, method, or parameter listed in the following sections.
Properties
.name Reflects the NAME attribute defined in the button's <INPUT> tag.
.value Reflects the VALUE attribute defined in the button's <INPUT> tag.
Methods
.click() Programmatically clicks the Reset button.
Event Handlers
onClick Triggered when the reader clicks on the Reset button.
Description
When the Reset button is clicked, all fields in the form are emptied or returned to their default values. There is no way to stop this from happening. The onClick event handler cannot prevent a form from being reset.
The reset object is a property of the larger form object.
Example
This Web page contains a regular form and Reset button. But when the reader clicks the Reset button, a small message appears telling the reader that all fields have been returned to their default values.
<HTML>
<BODY>
<FORM name = "ReaderInfo">
<INPUT NAME="Your Name:" VALUE="type your name here"MAXLENGTH="50" SIZE=50>
<P>
<INPUT NAME="EmailAdd" VALUE="type email address here"MAXLENGTH="40" SIZE=40>
<P>
<INPUT type="reset" onClick="alert ('Returned all fields to default values')">
</FORM>
</BODY>
</HTML>
|
|
   |
 |
