spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / programming / prof_java / 1 To page 1To page 2To page 3current pageTo page 5
[previous] [next]

Content Coordinator
Aquent
US-WA-Redmond

Justtechjobs.com Post A Job | Post A Resume
Developer News
Mandrake Linux Founder Back, Virtually
Amazon: We're a Technology Company
Sun Expands MySQL With Closed Source

Professional JavaScript for Web Developers: JavaScript in the Browser, Pt. 1

The <script/> tag in SVG

SVG adopted a similar version of the <script/> tag for including JavaScript in its pages. This <script/> tag, however, is different from its HTML sibling::

  • The type attribute is required. This can be set to text/javascript or text/ecmascript, though the former is technically the correct one.

  • The language attribute is illegal. Including this attribute causes SVG code to be invalid.

  • CDATA sections are required for inline code. Because SVG is a true XML-based language, it properly supports CDATA sections and, therefore, requires them when inline code uses special XML characters.

  • Uses xlink:href instead of src. In SVG, no src attribute is used on a <script/> tag. Instead, SVG uses the xlink:href attribute to indicate an external file to reference.

For example:

In this code, the two <script/> tags are correct for SVG. The first, containing inline code, is surrounded by a CDATA section so no problems arise if you use special characters; the second uses the xlink:href attribute to reference an external file.

Tag placement in SVG

Because no <head/> area exists in SVG, <script/> tags can be placed nearly anywhere. Typically, however, they are placed:

  • Immediately after the <desc/> tag

  • Inside of the <defs/> tag

  • Just before the outermost <g/> tag

The <script/> tag cannot be placed inside of shapes, such as <rect/> or <circle/>, nor can they be placed inside of filters, gradients, or other appearance-defining tags.

The Browser Object Model

You can’t really talk about JavaScript in the browser without talking about the Browser Object Model (BOM), which provides objects that interact with the browser window independent of the content.

The BOM is made up of a series of objects that are related to one another. Figure 5-3 shows the basic BOM hierarchy.

As you can see, the window object is the center of the BOM universe, with all objects and collections somehow connecting back to it. I begin the discussion of the BOM with this object.

The window object

The window object represents an entire browser window, but not necessarily the content that the window contains. Rather, window can be used to move, resize, and otherwise affect the browser that it represents.

If a page uses framesets, each frame is represented by its own window object and stored in the frames collection. Within the frames collection, the window objects are indexed both by number (starting at 0, going first left-to-right, then row-by-row) and by the name of the frame. Consider the following example:

This code creates a frameset with one frame across the top and two frames underneath. Here, the top frame can be referenced by window.frames[0] or window.frames[“topFrame”], however, you would probably use the top object instead of window to refer to these frames (making it top.frames[0], for instance).

The top object always points to the very top (outermost) frame, which is the browser window itself. This assures that you are pointing to the correct frame. If you then write code within a frame, the window object referenced in it is a pointer to just that frame.

Because the window object is the center of the BOM universe, it enjoys a special privilege: You don’t need to explicitly reference it. Whenever a function, object, or collection is referenced, the interpreter always looks to the window object, so window.frames[0] can be rewritten as just frames[0]. To understand the various ways to reference the frames in the previous example, refer to Figure 5-4.

It is also possible to access a frame directly using its name, such as window.leftFrame. However, using the frames collection is generally more acceptable because it more accurately represents the code’s intent.

home / programming / prof_java / 1 To page 1To page 2To page 3current pageTo page 5
[previous] [next]

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers

webref The latest from WebReference.com Browse >
Working with the DOM Stylesheets Collection · Administering RBAC in PHP 5 CMS Framework · xref: Automatic Cross Referencing Script
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Combine BottomCount() with Other MDX Functions to Add Sophistication · Creating a Daemon with Python · The Coming Voice-over-WiMAX Revolution

Created: March 27, 2003
Revised: June 20, 2005

URL: http://webreference.com/programming/prof_java/1