Contents

Preface xix

IntroduCtIon to JavasCrIppart I: t

addIng JavasCrIpt to a Web page Lesson 1: 3

The <script/> Element 3Tag Placement 5

Try It 6Lesson Requirements 6

Step-by-Step 6

varIabLes and JavasCrIpt syntax Lesson 2: 9

Variables 9Primitive Data Types in JavaScript 12

Determining a Variable’s Data Type 21

Keywords and Reserved Words 22Try It 22

Lesson Requirements 22

Step-by-Step 23

FunCtIons 2Lesson 3: 5

Function Declarations 26Functions as Values 29Passing Functions to Other Functions 30Returning Functions 31Try It 32

Lesson Requirements 32

Step-by-Step 32

MakIng deCIsIons 3Lesson 4: 5

Conditional Statements 35Comparison Operators 35

Logical Operators 38

Assigning the Results of Conditions 41

647837ftoc.indd 9 10/27/10 1:46:19 AM

COPYRIG

HTED M

ATERIAL

x

CONTENTS

Executing Code Based on Conditions 41The if Statement 41

The switch Statement 43

The Ternary Operator 45

Try It 45Lesson Requirements 45

Step-by-Step 46

Loops 4Lesson 5: 9

Loop Basics 49The for Loop 50The while Loop 52The do-while Loop 52Try It 53

Lesson Requirements 53

Step-by-Step 54

sCope 5Lesson 6: 7

Global Scope 57Functional Scope 58No Block-Level Scopes 60Variable Declarations 61Identifier Lookup 61Try It 62

Lesson Requirements 62

Step-by-Step 63

obJeCts and buILt-In types 6Lesson 7: 5

What Are Objects? 65Using JavaScript Objects 66Built-In Data Types 67

Array 67

Date 73

Number 75String 76

Try It 79Lesson Requirements 79

Step-by-Step 79

647837ftoc.indd 10 10/27/10 1:46:20 AM

xi

CONTENTS

CustoM obJeCts 8Lesson 8: 3

The Object Data Type 83Outputting Objects 85

Objects as Input 86

Creating Custom Data Types 86Try It 88

Lesson Requirements 88

Step-by-Step 88

prototypes and InherItanCe (the FunCtIon obJeCt)Lesson 9: 91

Using the prototype Object 92Inheriting Members from Other Objects 94Try It 96

Lesson Requirements 96

Step-by-Step 96

prograMMIng the broWsepart II: r

the WIndoW obJeCt 10Lesson 10: 1

The Global Scope 101Variables and Functions Are Properties and Methods 102

The this Variable 103

Showing and Using Dialog Boxes 103The Alert Dialog Box 103

The Prompt Dialog Box 104

The Confirm Dialog Box 104

The Location Object 105Reloading the Page 105

Navigating to Another Page 106

Try It 106Lesson Requirements 106

Step-by-Step 107

sCrIptIng WIndoWs 10Lesson 11: 9

Opening New Windows 109Manipulating Windows 112Coding between Windows 115Security 117Try It 117

Lesson Requirements 118

Step-by-Step 118

647837ftoc.indd 11 10/27/10 1:46:20 AM

xii

CONTENTS

sCrIptIng FraMes 12Lesson 12: 1

Frames and the window Object 121Try It 125

Lesson Requirements 125

Step-by-Step 126

the doCuMent obJeCt ModeL 12Lesson 13: 9

What Is the DOM? 129Navigating the DOM 132Selecting Element Nodes 133Try It 135

Lesson Requirements 135

Step-by-Step 135

addIng htML WIth JavasCrIpt 13Lesson 14: 7

DOM Creation Methods 137Creating Elements 138

Adding Elements to the Document 139

Creating and Adding Text Nodes 140

Using the innerHTML Property 142Try It 142

Lesson Requirements 142

Step-by-Step 143

ModIFyIng eLeMent styLe 14Lesson 15: 7

Using the style Property 147Using the className Property 150Try It 150

Lesson Requirements 150

Step-by-Step 151

IntroduCtIon to events 15Lesson 16: 5

Mouse Events 157Movement-Based Events 157

Button-Based Events 157

Keyboard Events 158Basic Events 158Try It 159

647837ftoc.indd 12 10/27/10 1:46:20 AM

xiii

CONTENTS

assIgnIng event handLers WIth htML attrIbutes 16Lesson 17: 1

Wiring Up Event Handlers 161Cancelling Default Behavior 163Try It 164

Lesson Requirements 165

Step-by-Step 165

usIng earLy doM event handLers 17Lesson 18: 3

Assigning Event Handlers 173Try It 175

Lesson Requirements 175

Step-by-Step 176

usIng standard doM and Ie event handLers 18Lesson 19: 5

Standard Event Handlers 186IE Event Handlers 188Try It 189

Lesson Requirements 189

Step-by-Step 190

WrItIng Cross-broWser event handLers 19Lesson 20: 5

Writing an Event Utility Object 197Modernizing Your Event Utility 199Try It 200

Lesson Requirements 200

Step-by-Step 201

the standard event obJeCt 20Lesson 21: 5

Accessing the Event Object 205Event Objects 206

Determining the Event That Occurred 206

Accessing the Event Target 207

Try It 209Lesson Requirements 209

Step-by-Step 210

647837ftoc.indd 13 10/27/10 1:46:20 AM

xiv

CONTENTS

Internet expLorer’s event obJeCt 21Lesson 22: 7

Accessing the event Object 217The event Object 218

Determining the Event That Occurred 218

Accessing the Event Target 219

Try It 220Lesson Requirements 220

Step-by-Step 221

WrItIng Cross-broWser event Code 22Lesson 23: 5

Acquiring the Event Target 225Canceling Default Behavior Redux 226Try It 228

Lesson Requirements 228

Step-by-Step 229

draggIng and droppIng 23Lesson 24: 5

Getting the Mouse Pointer’s Location 235Client Coordinates 236

Element Coordinates 237

Events Used in Drag-and-Drop 238Try It 238

Lesson Requirements 239

Step-by-Step 239

tIMers and anIMatIng eLeMents 24Lesson 25: 9

Setting a Delay — the setTimeout() Method 249Setting an Interval — the setInterval() Method 252Try It 252

Lesson Requirements 253

Step-by-Step 253

ForMsLesson 26: — a prIMer 261

Forms and the DOM 261Form Control Elements 262

The name Property 263

The value Property 263

The form Property 264

The type Property 264

647837ftoc.indd 14 10/27/10 1:46:20 AM

xv

CONTENTS

The disabled Property 264

The focus() and blur() Methods 264

Try It 265Lesson Requirements 265

Step-by-Step 265

sCrIptIng buttons 26Lesson 27: 7

Try It 269Lesson Requirements 269

Step-by-Step 270

sCrIptIng text eLeMents 27Lesson 28: 3

The Textbox 273The Password Textbox 274The Hidden Textbox 274The Multiline Textbox 275Try It 275

Lesson Requirements 275

Step-by-Step 276

sCrIptIng seLeCtIon boxes 28Lesson 29: 3

Removing Options 284Adding Options 285Try It 287

Lesson Requirements 287

Step-by-Step 287

sCrIptIng CheCkboxes and radIo buttons 29Lesson 30: 5

Scripting Checkboxes 295Scripting Radio Buttons 297Try It 297

Lesson Requirements 297

Step-by-Step 298

an IntroduCtIon to aJax 30Lesson 31: 5

What Is Ajax? 306Google Suggest 306

Google Maps 306

Requirements for Ajax 308

647837ftoc.indd 15 10/27/10 1:46:20 AM

xvi

CONTENTS

usIng xMLhttprequest obJeCts 31Lesson 32: 1

Creating XHR Objects 311Browsers with Native Support 312

Browsers that Support XmlHttp 312

Using XHR Objects 313Determining the Success of a Request 315Security 316Try It 317

Lesson Requirements 317

Step-by-Step 317

MakIng aJax requests usIng get 32Lesson 33: 1

Making GET Requests 321Asynchronous Programming 323Try It 325

Lesson Requirements 325

Step-by-Step 325

MakIng aJax requests usIng post 32Lesson 34: 9

Assembling Data 329Making POST Requests 332Try It 333

Lesson Requirements 333

Step-by-Step 334

Json 33Lesson 35: 9

XML Rules the World…Or Does It? 339JavaScript Object Notation Saves the World 341Converting to and from JSON 343Try It 346

Lesson Requirements 346

Step-by-Step 347

handLIng errors, debuggIng, and best praCtICepart III: s

CoMMon CodIng MIstakes 35Lesson 36: 3

Undefined Variables 353Case-Sensitivity 354

647837ftoc.indd 16 10/27/10 1:46:20 AM

xvii

CONTENTS

Closing Braces and Parentheses 355Operator Misuse 356

handLIng errors 35Lesson 37: 7

Preventing Errors 357The try…catch Statement 358Throwing Exceptions 359Try It 360

Lesson Requirements 360

Step-by-Step 360

debuggIng WIth FIrebug 36Lesson 38: 7

Getting Familiar with the UI 368Setting Breakpoints 371

Stepping through Code 372

Try It 373Lesson Requirements 373

Step-by-Step 374

CodIng guIdeLInes 37Lesson 39: 7

Use Whitespace 377Variable Declarations 378Avoid the Global Scope 379Use Literals 379

separatIng JavasCrIpt and htML 38Lesson 40: 1

Try It 382Lesson Requirements 383

Step-by-Step 383

separatIng JavasCrIpt and Css 38Lesson 41: 7

avoIdIng gLobaL sCope 38Lesson 42: 9

Using Functions 390Emulating Namespaces 392Try It 393

Lesson Requirements 393

Step-by-Step 393

647837ftoc.indd 17 10/27/10 1:46:20 AM

xviii

CONTENTS

optIMIzIng your Code 39Lesson 43: 9

Refactoring Code 399Refactoring Duplicate Code 400

Reducing Statements 401

Optimizing DOM Code 402Using Document Fragments 403

Using innerHTML 404

Use Event Delegation 405Try It 406

Lesson Requirements 406

Step-by-Step 407

What’s on the dvd? 41appendIx: 3

System Requirements 413Using the DVD on a PC 414Using the DVD on a Mac 414What’s on the DVD 414Troubleshooting 415Customer Care 415

Index 417

647837ftoc.indd 18 10/27/10 1:46:20 AM