Reference to JavaScript Objects and Functions 435
Example:
if (isNaN(Math.sqrt(-1)))
{
alert("Get real! You can't take the square root of -1!");
}
Methods
Example:
var the_answer = 4321;
alert(the_answer.exponential(2));
The alert contains the string 4.32e+3.
Option
The option object refers to an option in a select element of a form—either
a pull-down menu or scrollable list. All the options of a
select element are
stored in the
options[] array of that element.
Properties
Example:
if (window.document.the_form.the_pulldown.options[0].selected == true)
{
var the_option_text =
window.document.the_form.the_pulldown.option[0].text;
alert("thanks for picking " + the_option_text);
}
NEGATIVE_INFINITY
FF, IE 4 Read-only: Value smaller than Number.MIN_VALUE. You know no
number will ever be less than this value.
POSITIVE_INFINITY
FF, IE 4 Read-only: Value bigger than Number.MAX_VALUE. No number
will ever exceed this value.

parseFloat() [FF, IE 3]
Converts a string to a floating-point number as long as the first character is a
number. If the first character is not a number,
parseFloat() returns NaN (not
a number). If the string is a number followed by letters,
parseFloat() grabs
the first set of numbers in the string.
Example:
var the_string = "3.14etc";
var the_numbers = parseFloat(the_string);
The variable the_numbers contains 3.14.
Password
The password form element, like the text form element, allows a visitor to type
a line of text into a form. In a
password element, however, asterisks or bullets
replace the letters to hide the contents from view. The element is represented
like this in HTML:
<input type = "password">.
Properties
text
FF, IE 3 Text associated with an option (see the preceding example)
value
FF, IE 3 Value of the option
defaultValue
FF, IE 3 Read-only: Browser-set default value for the element
Form
FF, IE 3 Read-only: Form containing the element
maxLength
FF, IE 4 Maximum number of characters allowed in the field
name

blur()
FF, IE 3 Removes the cursor from the password element
focus()
FF, IE 3 Moves the cursor to the password element
select()
FF, IE 3 Selects the text inside the password element
onBlur
FF, IE 3 Called when a visitor removes the cursor from the password element
onChange
FF, IE 3 Triggered when a visitor changes the contents of the field and then clicks
out of the field or presses
ENTER
438 Appendix C
Example:
<input type = "password" onFocus = "window.open('instruct.html','inst')";>
This method opens a window when a visitor clicks inside the password
field.
prompt()
A dialog box that has OK and Cancel buttons, a place for a message to the
visitor, and a box into which the visitor may type a reply. The
prompt() function
returns the visitor’s reply and takes two parameters: a message that appears
above the input area and a default value to put in the input area. If the
visitor clicks Cancel,
prompt() returns the value null.
Example:
var the_name = prompt("What's your name?", "your name here");
if (the_name == null)
{
the_name = prompt("Come on! What's your name?","Please ");

Handlers
Reset
See “Button (Including Submit and Reset Buttons)” on page 416.
Screen
The screen object contains a number of read-only properties that provide
information about the computer screen used to view a web page.
Properties
Example:
var screen_height = screen.availHeight;
Select
The select form element can either be a pull-down menu or a scrollable
list. The items in it are called the options of the select and are stored in the
select element’s options[] array.
defaultValue
FF, IE 3 Read-only: Browser-set default value for the element
length
FF, IE 3 Read-only: Number of elements in a group of radio buttons with the
same name
name
FF, IE 3 Radio button’s name
type
FF, IE 3 Read-only: Identifies element as a radio button
value
FF, IE 3 Value of a radio button
click()
FF, IE 3 Simulates a click on the element
onClick
FF, IE 3 Triggered when a visitor clicks the radio button
availHeight, availWidth FF, IE 4 Read-only: Available height and width of the screen, in
pixels. Excludes the taskbar in Windows systems and any

eters: the JavaScript statements to execute and the number of milliseconds
between each execution. The function returns a reference to the interval so
that
clearInterval() may cancel it.
For example:
var the_interval = setInterval("alert('Stop procrastinating!');", 10000);
creates an interval that calls up an alert box every 10 seconds.
length
FF, IE 3 Number of options in the select
multiple
FF, IE 4 If true, accept multiple selections in select box
name
FF, IE 3 select object’s name
options[]
FF, IE 3 Read-only: Array containing the select’s options. See “Option”
on page 435 for more information.
selectedIndex
FF, IE 3 Contains the selected option’s array position in a select element. If
no item has been selected,
selectedIndex is 1. If more than one
option has been selected,
selectedIndex contains the position of
the first option. To determine all the options selected, use a loop to
look at the
selected property of each option object. See “Option”
on page 435 for more information.
onChange
FF, IE 3 Triggered when a visitor selects or deselects an option
Reference to JavaScript Objects and Functions 441
setTimeout() [FF, IE 3]

as the text of the link
big()
FF, IE 3 Puts the string between <big> and </big> tags
442 Appendix C
For example:
var the_string = "something really important";
window.document.writeln(the_string.bold());
writes <b>something really important</b> to a web page.
For example:
var the_string = "rabbit";
var the_first_char = the_string.charAt(0);
sets the_first_char to r because r is in position 0 of the string.
For example:
var the_string = "Hi";
window.document.writeln(the_string.concat(" there"));
writes "Hi there" to a web page.
For example:
var the_string = "pretty";
window.document.writeln(the_string.fontcolor("pink"));
writes <FONT COLOR = "pink">pretty</FONT> to a web page.
For example:
var the_string = "cheese";
window.document.writeln(the_string.fontsize(48));
writes <FONT SIZE = "48">cheese</FONT> to a web page.
bold()
FF, IE 3 Puts the string between <b> and </b> tags
charAt()
FF, IE 3 Takes a number as a parameter and returns the character in that position
of the string. Returns
null if there is no character.

var the_string = "The last word.";
var last_space = the_string.lastIndexOf(" ");
sets last_space to 8.
For example:
var the_string = "News For Geeks";
window.document.writeln(the_string.link(""));
writes <a href = "">News for Geeks</A> to a web page.
String.fromCharCode()
FF, IE 4 Constructs a string from ASCII codes
indexOf()
FF, IE 3 Searches within the string for the substring specified by the first parameter.
The optional second parameter is an integer that dictates where in the
string to start searching. If the string contains the substring,
indexOf()
returns the position of the substring within the string. If the string does
not contain the substring,
indexOf() returns 1.
italics()
FF, IE 3 Puts the string between <i> and </i> tags
lastIndexOf()
FF, IE 3 Returns the position of the last occurrence of a substring in a string.
Like
indexOf(), it can take one or two parameters. The first is the
substring to search for, and the second is where in the string to start
searching.
link()
FF, IE 3 Takes a URL as a parameter and creates a hyperlink with the string as the
text of the link and the URL as the contents of the
HREF attribute
444 Appendix C

string that matches the expression, or
1 if the regular expression does
not match
slice()
FF, IE 4 Returns a substring of a string. Takes a start position and an end position
of the substring. If end position is not included, returns from start position
to the end of the string.
small()
FF, IE 3 Puts the string between <small> and </small> tags
sub()
FF, IE 3 Puts the string between _and tags
substr()
FF, IE 4 Extracts a substring from a string. Takes two parameters: the position of
the first character of the substring and the length of the substring. Similar
to the
substring() method.
Reference to JavaScript Objects and Functions 445
Example:
var the_string = "core";
var the_extract = the_string.substr(1, 2);
This code sets the_extract to "or" because "o" is in position 1 in the string
and is 2 letters long.
Example:
var the_string = "core";
var the_extract = the_string.substr(1, 3);
This code example sets the_extract to "or" because "o" is in position 1 of
the string and
"e", the letter after the last character in "or", is in position 3.
Example:
var the_string = "\u0041pple";

446 Appendix C
The style object is available for all HTML elements. The following line
accesses the
style object for the div in the preceding example:
var the_style = document.getElementById("mystyle").style;
All the properties of a style object are read-write. There are many, many
properties for the
style object. The ones compatible with both Firefox and
Internet Explorer 5 and above are listed in the following table. For more
information about those properties, pick up a good book on CSS or
Dynamic HTML.
Properties [FF, IE 5]
Submit
The submit button sends an onSubmit event to the form that contains it. See
“Button (Including Submit and Reset Buttons)” on page 416 for more
information.
Text
The text form element allows a visitor to type a line of text into a form. See
“Password” on page 436 for more information.
background borderRightWidth fontVarient paddingTop
backgroundAttachment borderStyle fontWeight pageBreakAfter
backgroundColor borderTop height pageBreakBefore
backgroundImage borderTopColor left position
backgroundPosition borderTopStyle letterSpacing right
backgroundRepeat borderTopWidth lineHeight tableLayout
border borderWidth listStyleImage textAlign
borderBottom bottom listStylePosition textDecoration
borderBottomColor clear listStyleType textIndent
borderBottomStyle clip margin textIndex
borderBottomWidth color marginBottom textTransform

form
FF, IE 3 Read-only: Form containing the element
maxLength
FF, IE 4 Maximum number of characters allowed in the field
name
FF, IE 3 Name of the textarea field
readOnly
FF, IE 4 true if users can’t enter data into the field
rows
FF, IE 4 Number of rows of this textarea
type
FF, IE 4 Read-only: Set to "TEXTAREA"
value
FF, IE 3 Text that appears in the textarea
blur()
FF, IE 3 Removes the cursor from the textarea
focus()
FF, IE 3 Moves the cursor to the textarea
select()
FF, IE 3 Selects the text inside the textarea
onBlur
FF, IE 3 Called when a visitor removes the cursor from the textarea
onChange
FF, IE 3 Triggered when a visitor changes the contents of the field and then clicks
outside the field or presses
ENTER
onFocus
FF, IE 3 Called when the cursor is put into the password field
448 Appendix C
this [FF, IE 3]

FF, IE 4 Read-only: true if a window has been closed and false if it is still open. The
window referenced is generally created using the
window.open() method.
Reference to JavaScript Objects and Functions 449
Example:
window.frames[0].document.writeln("Hello!");
This line writes the word Hello! into the document of the first frame in
the window’s frame set.
Example:
var first_frame_name = window.frames[0].name;
Example:
function alertError(the_message, the_url, the_line)
{
var the_string = "Warning, Will Robinson! " + the_message;
the_string += " occurred on line " + the_line " of " + the_url;
}
window.onerror = window.alertError;
Now, whenever there is a JavaScript error, an alert will pop up with the
contents of that error.
defaultStatus
FF, IE 3 Read-only: Browser’s default message in the status area of the
window
document
FF, IE 3 Read-only: document object of the window. See “Document” on
page 421 for more information.
frames[]
FF, IE 3 Read-only: Array of frames stored in a window. Each frame is
considered another
window object.
history

window.status = "Don't forget to smile!";
offscreenBuffering
IE 4 Setting this to true may reduce flicker in DHTML animations
opener
FF, IE 3 Reference back to the window or frame that opened the
current window
outerHeight
FF Height of the window (only signed scripts can make this smaller than
100 pixels)
outerWidth
FF Width of the window (only signed scripts can make this smaller than
100 pixels)
pageXOffset
FF Read-only: How far to the right the screen has scrolled in pixels
pageYOffset
FF Read-only: How far down the screen has scrolled in pixels
parent
FF, IE 3 Read-only: Parent of this window (used in the context of frames)
screen
FF, IE 4 Read-only: Window’s screen object
screenLeft
IE 5 Read-only: Horizontal coordinate (in pixels) of the left border of the
browser window’s content area relative to the upper left corner of the
screen. The content area is where the web page resides.
screenTop
IE 5 Read-only: Vertical coordinate (in pixels) of the top border of the
browser window’s content area relative to the upper left corner of
the screen. The content area is where the web page resides.
screenX
FF Horizontal coordinate of the left side of the window

FF, IE 3 Read-only: Topmost window in a window hierarchy. Helpful when your
JavaScript is in a deeply nested frame and you want it to affect the whole
web page.
blur()
FF, IE 4 Sends a window behind all the other windows on the screen
close()
FF, IE 3 Closes a window
open()
FF, IE 3 Opens a new window and returns a reference to it. Takes three param-
eters: the URL of the window to open, the target name of the window, and
a comma-delimited list of features the window should have. Some of the
features, such as width and height, must have values assigned to them. If
the third parameter is left out, the new window contains the same features
as the window that opened it.
copyhistory
Copies the history of the current window to the window being opened (that is, it
enables the use of the back button in the new window)
directories
Directory buttons
height
Height of the new window
location
Location bar (where URLs may be typed)
452 Appendix C
The following list contains features that only work in Firefox and similar
browsers. Certain features, noted by an asterisk, require that Firefox sign
your script.
Methods
Example:
window.scroll(100,500);

Total height of the window
outerWidth
Total width of the window
screenX
How far from the left side of the screen the window appears
screenY
How far from the top of the screen the window appears
titlebar*
Set titlebar = no to hide the title bar
z-lock*
Puts the window below all other browser windows
scroll()
FF, IE 4 Takes two parameters: a number of pixels to scroll horizontally and a
number to scroll vertically
scrollBy()
FF, IE 4 Takes two parameters: the number of pixels to scroll the window
horizontally and vertically (use negative numbers to move the scroll
bars to the left or up)
Reference to JavaScript Objects and Functions 453
Less Common Methods
Handlers
Window handlers go inside the <body> tag of the web page.
Example:
<body onBlur = "window.close();">
This window closes itself if the user selects another window.
Example:
<body onError = "alert('Warning! JavaScript error!');">
Example:
<body onFocus = "alert('Nice to see you again.');">
For example:

FF, IE 4 Triggered when the window is no longer topmost on the screen
onError
FF, IE 4 Triggered when a JavaScript error occurs
onFocus
FF, IE 4 Triggered when the user selects the window
onLoad
FF, IE 3 Triggered when the page, including all its images, has completely loaded
454 Appendix C
Example:
<body onResize = "alert('Hey, that tickles.');">
Example:
<body onUnload = "alert('Sorry to see you go!');">
XMLHttpRequest [FF]
and ActiveXObject("Microsoft.XMLHTTP") [IE 5.5]
These objects are used extensively in Ajax, as described in Chapters 14, 15,
16, and 17.
Properties
Methods
Handlers
onResize
FF, IE 4 Triggered when the visitor has resized the page
onUnload
FF, IE 3 Triggered when a visitor is about to leave the page. This occurs even when
the browser holding the page is closed, when the visitor clicks a link, or
when the visitor reloads the page.
readyState
State of the request
responseText
String containing the response to the request
responseXML

request = new XMLHttpRequest();
} else {
request = new ActiveXObject("Microsoft.XMLHTTP");
456 Appendix D
}
if (request) {
request.open("GET", the_file + ".xml");
request.onreadystatechange =
function() {
if (request.readyState == 4) {
xml_response = request.responseXML;
displayResults(findTranslations(xml_response, the_word));
}
}
request.send(null);
} else {
alert("Sorry, you must update your browser before seeing" +
" Ajax in action.");
}
}
function findTranslations(xml_doc, the_word) {
var these_translations = new Array();
var this_word = "", this_result = "";
var found = false;
var loop = 0;
var reg_exp = new RegExp("^" + the_word);
var the_translation = null;
if (the_word.length == 0) {
return these_translations;
}

var display_me = "";
var splitter;
var this_result = null;
for (var loop = 0; loop < the_results.length; loop++) {
this_result = the_results[loop];
if (this_result != null) {
splitter = this_result.split("\t");
display_me += "<tr><td align='left'>" + splitter[0] +
"</td><td align='right'>" + splitter[1] + "</td></tr>";
}
}
document.getElementById("theResults").style.height =
(the_results.length + parseInt(the_results.length / 5) + 1) + "em";
document.getElementById("theResults").innerHTML =
"<table width='100%' border='0' cellpadding='0' cellspacing='0'>" +
display_me + "</table>";
}
// show me >
</script>
</head>
<body>
<form>
<input type = "text" size = "55" id = "theText"
onKeyUp = "getTranslations('italian', this.value);">
<div id = "theResults"
style = "width:22em;border:1px black solid;padding-left:2px;padding-
right:2px">
</div>
</form>
</body>

}
);
}
function getUser(user_info, user_name) {
var users = user_info.getElementsByTagName("user");
var count = 0;
var found_user = null;
var this_user;
while ((count < users.length) && (found_user == null)) {
this_user = users[count];
this_name = getFirstValue(this_user, "name");
//this_user.getElementsByTagName("name")[0].firstChild.nodeValue;
if (this_name == user_name) {
found_user = this_user;
}
count++;
}
return found_user;
}
function processLogin(user_info, my_form) {
var user_name = my_form.elements["name"].value;
var user_password = my_form.elements["password"].value;
var this_password_node;
var success = false;
var this_password;
var this_user = getUser(user_info, user_name);
if (this_user != null) {
this_password = getFirstValue(this_user, "password");
if (user_password == this_password) {
Chapter 15’s Italian Translation Script and Chapter 17’s To Do List Application 459

request.send(null);
} else {
document.getElementById("errorDiv").innerHTML =
"Sorry, you must update your browser before seeing Ajax in action.";
}
}
function saveFileDoFunction(file_name, the_contents, the_function) {

if (window.XMLHttpRequest) {
request = new XMLHttpRequest();
} else {
request = new ActiveXObject("Microsoft.XMLHTTP");
}
var the_url = "http://localhost/boj/ch17/saveXMLFile.php?t=" +
new Date().getTime();
var the_message = "fileName=" + file_name + "&contents=" + the_contents;