Books
in black and white
Main menu
Share a book About us Home
Books
Biology Business Chemistry Computers Culture Economics Fiction Games Guide History Management Mathematical Medicine Mental Fitnes Physics Psychology Scince Sport Technics
Ads

Javascript for dummies 4th edition - Veer E.V

Veer E.V Javascript for dummies 4th edition - Wiley publishing , 2004. - 387 p.
ISBN: 0-7645-7659-3
Download (direct link): javascriptfordummies2005.pdf
Previous << 1 .. 24 25 26 27 28 29 < 30 > 31 32 33 34 35 36 .. 118 >> Next

72 Part I: Building Killer Web Pages for Fun and Profit
Chapter 4
JavaScript-Accessible Data: Getting Acquainted with the Document Object Model
In This Chapter
^ Understanding how object models work ^ Exploring properties and methods ^ Adding text to a Web page dynamically ^ Positioning text on a Web page ^ Changing Web page appearance on-the-fly ^ Getting familiar with Netscape Navigator’s object model ^ Getting familiar with Internet Explorer’s object model
7o create powerful scripts, you need to be familiar with two things: JavaScript syntax (which I discuss in Chapter 3) and the document object model.
The document object model, or DOM, refers to the Web page components, or objects, that you can access and manipulate by using JavaScript. Examples of objects that you can work with in JavaScript include the window that a Web page appears in, the Web page itself, embedded images and text, and much, much more.
In this chapter, I demonstrate how to find out which objects you can access in JavaScript, including those objects’ properties and methods. First, I discuss the nuts and bolts of the DOM; then, I present three scripts that use document objects to change the appearance of a Web page on-the-fly.
74
Part I: Building Killer Web Pages for Fun and Profit
Object Models Always Pose Nude
Because JavaScript is object-based, when you program in JavaScript you get to take advantage of a predefined object model. Object-based programming languages package, or encapsulate, data and functionality into useful units called objects. (Collectively, the objects that you work with in an object-based programming language are called the object model.) Encapsulation is a good thing because it hides nitty-gritty programming details — allowing you, the programmer, to write code with the least amount of hassle possible.
Human beings tend to think in terms of object models naturally, so object-based languages like JavaScript are typically much easier to handle than their procedural counterparts. (Examples of procedural languages include BASIC, C, and COBOL.)
Here’s a real-world example of an object model. If I tell you my friend Ralph works in an office, you might reasonably assume that Ralph has a boss, a few co-workers, sits at a desk, and does some kind of work. How do you know all this without me telling you? Because you’ve seen or heard of other offices; perhaps you’ve even worked in one yourself. In other words, you’re familiar with the office model — so even though you don’t know anything about Ralph’s particular office just yet, you can correctly guess a great deal. In fact, all I have to do is fill in a few specific details (the names of Ralph’s co-workers, what kind of work he does, and so on) for you to have a complete picture of how Ralph spends his day.
The beauty of an object model is that it helps people communicate clearly and efficiently.
JavaScript’s object model (called the document object model, or DOM) is no exception. Specifically, it helps you clearly and efficiently communicate what you want your script to do to the JavaScript interpreter. (The JavaScript interpreter is the part of a Web browser that executes a script. You can see the JavaScript interpreter in action in Chapter 2.)
The DOM performs this oh-so-useful task by describing
All the objects that go into making up a Web page, such as forms, links, images, buttons, and text.
The descriptive properties associated with each of the DOM objects.
For example, an image object can be associated with specific properties describing its height and width.
The behaviors, or methods, associated with each of the DOM objects. For example, the window object supports a method called alert() that allows you to display an alert message on a Web page.
Chapter 4: Getting Acquainted with the Document Object Model
^ The special built-in methods, called event handlers, associated with automatic and user-initiated events. For instance, loading a Web page into a browser is considered an event; so is clicking a button. The event handlers that you use to trigger some JavaScript code when these events occur are called onLoad and onClick, respectively.
In the following sections, I give you an in-depth look at each of these four categories and how you can use them to create your own powerful JavaScript scripts!
A\Nfi/
Conceptually, the DOM is the same whether you’re viewing a Web page in Internet Explorer, Netscape Navigator, or another browser entirely. In practice, however, the versions of the DOM implemented for Internet Explorer and Netscape Navigator differ — and you must pay attention to these differences or risk creating scripts that some users can’t view. See “Browser Object Models” later in this chapter for details.
Object-ivity
In nerd-talk, an object is a software representation of a real-world thing. Theoretically, any person, place, thing, or can be represented as an object.
In practice, however, most of the objects that you work with in JavaScript fall into the first three of the following four categories:
Previous << 1 .. 24 25 26 27 28 29 < 30 > 31 32 33 34 35 36 .. 118 >> Next