JavaScript Editor JavaScript Debugger     JavaScript Editor 

Team LiB
Previous Section Next Section

List of Figures

Chapter 1: Introduction to JavaScript

Figure 1-1: "Hello World from JavaScript" under Internet Explorer
Figure 1-2: JavaScript error dialog
Figure 1-3: JavaScript code may print on the screen if not masked.
Figure 1-4: Use <noscript> to handle browsers with no JavaScript.
Figure 1-5: Scripts can interact with users.
Figure 1-6: JavaScript console used for debugging and testing

Chapter 2: JavaScript Core Features—Overview

Figure 2-1: Output of write() and writeln() methods

Chapter 3: Data Types and Variables

Figure 3-1: Illustrating escape codes and quoting in strings
Figure 3-2: A local variable hides a global variable of the same name.
Figure 3-3: Variables may be visible without yet being initialized.

Chapter 4: Operators, Expressions, and Statements

Figure 4-1: Logical expressions can be short-circuited.
Figure 4-2: Modern browsers try to gracefully accommodate non-terminating scripts.
Figure 4-3: break used with and without a label
Figure 4-4: continue used both with and without the label
Figure 4-5: The for…in statement is useful for iterating over an object’s properties.

Chapter 6: Objects

Figure 6-1: Enumerating properties of the Document object with a for/in loop
Figure 6-2: Mozilla supports array-style indexing of strings.
Figure 6-3: Reference variables can be changed within functions.
Figure 6-4: Associative arrays provide key/value data lookup capabilities in JavaScript.

Chapter 7: Array, Date, Math, and Type-Related Objects

Figure 7-1: Common Date functions in action
Figure 7-2: Conversion of a Date object to a string

Chapter 8: Regular Expressions

Figure 8-1: Regular expressions simplify pattern matching.
Figure 8-2: The global flag starts searching where the previous match left off.
Figure 8-3: Parsing out words in a string using exec() on a regexp with the global flag set
Figure 8-4: Results of regular expression matching without the global flag

Chapter 9: JavaScript Object Models

Figure 9-1: JavaScript: The “big picture”
Figure 9-2: The initial JavaScript object model
Figure 9-3: Simple Document properties
Figure 9-4: Some Document properties require no HTML elements.
Figure 9-5: Netscape 3 object model
Figure 9-6: Netscape 4 object model
Figure 9-7: Internet Explorer 3 object model basically mimics Netscape 2.
Figure 9-8: Internet Explorer 4 object model
Figure 9-9: IE’s document.all collection exposes all document elements.

Chapter 10: The Standard Document Object Model

Figure 10-1: Reported DOM support under IE, Mozilla, and Opera
Figure 10-2: Simple tree walk output
Figure 10-3: DOM tree walk tool
Figure 10-4: Simple DOM-based HTML editor
Figure 10-5: Rendering of CSS Inline Tester under Mozilla
Figure 10-6: Using document.all[] across browsers

Chapter 11: Event Handling

Figure 11-1: A click on the bold text causes a click event, which bubbles up the hierarchy.
Figure 11-2: If an event is cancelable, setting event.cancelBubble prevents the event from propagating.
Figure 11-3: Contextual information is passed in through the Event object.
Figure 11-4: Canceling default behavior is not the same as stopping propagation.

Chapter 12: Controlling Windows and Frames

Figure 12-1: Simple window and its source
Figure 12-2: Frame relationships

Chapter 13: Handling Documents

Figure 13-1: Rendering of background and color example
Figure 13-2: Form field access example
Figure 13-3: Example Image properties
Figure 13-4: Inspecting and changing the <table> tag using the DOM
Figure 13-5: Cell and row manipulation example

Chapter 14: Form Handling

Figure 14-1: Exercising basic Form methods and properties
Figure 14-2: Text fields being tested
Figure 14-3: Checkbox/radio example under Internet Explorer
Figure 14-4: Rendering of dynamic form example

Chapter 15: Dynamic Effects: Rollovers, Positioning, and Animation

Figure 15-1: Manipulating Image properties with JavaScript
Figure 15-2: Updating a separate region of the document in response to a rollover
Figure 15-3: Testing our cross-browser content region library
Figure 15-4: DHTML in standards-supporting browsers requires knowledge of CSS.
Figure 15-5: Computed style and actual style may vary
Figure 15-6: A simple DHTML page transition
Figure 15-7: A JavaScript UFO in flight

Chapter 16: Navigation and Site Visit Improvements

Figure 16-1: A basic pulldown menu
Figure 16-2: An improved pull-down menu with divisions
Figure 16-3: A simple DHTML pull-down menu
Figure 16-4: Remote control windows give you a way to move controls outside of the main browser window.
Figure 16-5: The slide-in menu in action
Figure 16-6: Using cookies for saving style customization

Chapter 17: Browser and Capabilities Detection

Figure 17-1: Browser detection results under Internet Explorer, Netscape, and Opera
Figure 17-2: Explorer’s client capabilities in action

Chapter 18: JavaScript and Embedded Objects

Figure 18-1: The output of the myhelloworld applet in Internet Explorer
Figure 18-2: JavaScript can call public methods of Java applets.
Figure 18-3: An embedded Flash file
Figure 18-4: Contents of the mimeTypes[] array in Mozilla
Figure 18-5: Example contents of the navigator.plugins[] array
Figure 18-6: The scriptable Flash plug-in lets us zoom in on the Flash file.

Chapter 19: Remote JavaScript

Figure 19-1: Unlikely news from JavaScript Ref’s authors
Figure 19-2: Spellchecking using RPC

Chapter 20: JavaScript and XML

Figure 20-1: Well-formed XML under Internet Explorer
Figure 20-2: Documents that aren’t well-formed won’t render.
Figure 20-3: Validation error message
Figure 20-4: Internet Explorer supports basic client-side XSL.
Figure 20-5: XML document transformed to HTML tables using XSL
Figure 20-6: Direct display of XML documents with CSS
Figure 20-7: XHTML with MathML and SVG under Mozilla
Figure 20-8: With IE’s data-binding you can output structured data easily.
Figure 20-9: XML document directly manipulated with JScript and the DOM
Figure 20-10: Netscape 6 and Mozilla can easily manipulate XML directly.
Figure 20-11: Reading an RSS feed with JavaScript

Chapter 21: Browser-Specific Extensions and Considerations

Figure 21-1: Using an Enumerator to iterate over all the elements in the page
Figure 21-2: Using the FileSystemObject in an HTA to implement a simple text editor
Figure 21-3: Data Binding example under Internet Explorer
Figure 21-4: Dynamic properties let you automate style calculations.
Figure 21-5: Using dynamic properties to create a basic calculator
Figure 21-6: Pop-up windows give you different behavior than alert()s or regular browser windows.

Chapter 22: JavaScript Security

Figure 22-1: Setting Mozilla’s overall JavaScript preferences
Figure 22-2: Categorizing sites into security zones with Internet Explorer
Figure 22-3: Most security zones have a default security template.
Figure 22-4: Customizing security zone properties

Chapter 23: JavaScript Programming Practices

Figure 23-1: Enabling notification of script errors in Internet Explorer
Figure 23-2: Syntax errors in Internet Explorer (top) and Mozilla (bottom)
Figure 23-3: Runtime errors in Internet Explorer (top) and Mozilla (bottom)
Figure 23-4: Using Error.stack to get a stack trace in Mozilla
Figure 23-5: A manually constructed stack trace
Figure 23-6: The Venkman JavaScript debugger in action
Figure 23-7: Enabling script debugging in Internet Explorer
Figure 23-8: Use Microsoft Script Debugger to help track down errors.
Figure 23-9: Automatic error reporting with the onerror handler
Figure 23-10: Obfuscated code is functionally equivalent to the original.

Appendix B: JavaScript Object Reference

Figure B-1: The “big picture” of JavaScript’s object model
Figure B-2: The traditional object model of Netscape 2 and Internet Explorer 3
Figure B-3: The Netscape 3 object model
Figure B-4: The Internet Explorer 3 object model
Figure B-5: The Netscape 4 object model
Figure B-6: The Internet Explorer 4+ object model

Team LiB
Previous Section Next Section

JavaScript Editor JavaScript Debugger     JavaScript Editor