Learn JavaScript Chuck Easttom Wordware Pub lishing, Inc. Library of Congress Cataloging-in-Publication Data Easttom, Chuck. Learn JavaScript / by Chuck Easttom. p. cm. ISBN 1-55622-856-2 (pb) 1. Computer graphics. 2. Computer games. I. Title. T385.F447 2000 794.8'166 dc21 00-047319 CIP © 2002, Wordware Publishing, Inc. All Rights Reserved 2320 Los Rios Boulevard Plano, Texas 75074 No part of this book may be reproduced in any form or by any means without permission in writing from Wordware Publishing, Inc. Printed in the United States of America ISBN 1-55622-856-2 10 9 8 7 6 5 4 3 2 1 0109 Product names mentioned are used for identification purposes only and may be trademarks of their respective companies. All inquiries for volume purchases of this book should be addressed to Wordware Publishing, Inc., at the above address. Telephone inquiries may be made by calling: (972) 423-0090 Contents Summary Chap ter 1 HTML Primer 1 Chap ter 2 JavaScript Primer 13 Chap ter 3 Alerts, Prompts, and User Feed back 33 Chap ter 4 Im age Ef fects 43 Chap ter 5 Back ground Ef fects 59 Chap ter 6 The Doc u ment Ob ject Model 75 Chap ter 7 Working with Date and Time 87 Chap ter 8 Working with Cookies 97 Chap ter 9 Working with the Sta tus Bar 111 Chap ter 10 Cre ating Dy namic Menus 121 Chap ter 11 Working with Forms 135 Chap ter 12 Strings in JavaScript 149 Chap ter 13 Math in JavaScript 157 Chap ter 14 Adding Plug-ins 169 Chap ter 15 Ob jects in JavaScript 181 Chap ter 16 Tips and Tricks 187 Chap ter 17 JavaScript Games 197 Chap ter 18 ActiveX and JavaScript 209 Chap ter 19 Pro gramming and JavaScript 217 Chap ter 20 An tique Book store Pro ject 223 Ap pen dix A On line Re sources 237 Ap pen dix B HTML Ref er ence 241 iii Ap pen dix C JavaScript Ref er ence 245 Ap pen dix D Com mon Er rors 251 iv n Contents Summary Con tents Ac knowl edg ments xi In tro duc tion xiii Chap ter 1 HTML Primer 1 Im ages and Hyperlinks 4 Colors and Back grounds 6 Ta bles 7 Lists 9 Mar quee 11 Sum mary 11 Chap ter 2 JavaScript Primer 13 Es sen tial Tools 13 Choosing a Browser 14 Ba sic JavaScript Struc ture 14 The <SCRIPT> Tag 14 Internal Scripts 14 External Scripts 15 Placing JavaScript Code 15 JavaScript Con ven tions 16 Using the Semicolon 16 Case Sensitivity 17 Comments 17 Using Quotes 17 Your First Script 18 Fun da men tal JavaScript Con cepts 20 Data Types and Vari ables in JavaScript 20 JavaScript Op er a tors 21 JavaScript State ments 23 Multiple Statements 23 Nested Statements 24 JavaScript Ex pres sions 24 JavaScript Func tion Dec la ra tions 24 Calling Functions 26 Di a log Boxes 27 Alert Boxes 28 Con firm Boxes 28 Prompt Boxes 29 v if State ment 30 Sum mary 31 Chap ter 3 Alerts, Prompts, and User Feed back 33 Alert Boxes 33 Prompt Boxes 35 Writ ing Back to the Web Page 38 An tique Book store Pro ject 41 Sum mary 42 Chap ter 4 Im age Ef fects 43 The Im age Ob ject 43 Roll over 44 Slide Show 46 Im age Pre view 51 Ban ner Ads 53 Im age Popup 54 An tique Book store Pro ject 56 Sum mary 57 Chap ter 5 Back ground Ef fects 59 Doc u ment Ob ject 59 Changing the Back ground Color 59 Changing the Back ground Im age 62 More Back ground Ef fects 68 An tique Book store Pro ject 70 Sum mary 73 Chap ter 6 The Doc u ment Ob ject Model 75 win dow Ob ject 75 doc u ment Ob ject 76 his tory Ob ject 76 The Doc u ment Ob ject 77 The Win dow Ob ject 80 The Nav i ga tor Ob ject 83 Using the His tory Ob ject 84 An tique Book store Pro ject 85 Sum mary 86 Chap ter 7 Working with Date and Time 87 Time of Day 87 Day of Week 89 Set Time out 92 An tique Book store Pro ject 93 Sum mary 95 Chap ter 8 Working with Cookies 97 Baking Your First Cookie 97 vi n Con tents SetCookie 99 GetCookie 100 Call ing the Func tions 101 Bake An other Cookie 102 An tique Book store Pro ject 106 Sum mary 109 Chap ter 9 Working with the Sta tus Bar 111 Im age Data 111 T-Banners 114 An tique Book store Pro ject 118 Sum mary 119 Chap ter 10 Cre ating Dy namic Menus 121 Pop-Up Menus 121 Drop-Down Menus 124 Pull-Down Menus 125 Ex panding Menus 129 An tique Book store Pro ject 132 Sum mary 134 Chap ter 11 Working with Forms 135 Form Ba sics 135 Text Fields and But tons 137 Op tions 138 Ra dio But tons 140 Check Boxes 141 Event Han dlers in Form El e ments 143 onSubmit 143 onReset 145 Syn op sis of Form El e ments 146 An tique Book store Pro ject 147 Sum mary 147 Chap ter 12 Strings in JavaScript 149 Cre ating Strings 149 String Length 149 String Methods 151 CharAt() 151 indexOf() 152 lastIndexOf() 153 substring() 153 Num ber-to-String Con ver sion 154 Empty String Con cat e na tion 155 An tique Book store Pro ject 155 Sum mary 155 Con tents n vii Chap ter 13 Math in JavaScript 157 Math e mat i cal Op er a tors 157 The Math Ob ject 159 Con stants 159 E 160 LN2 160 LN10 160 LOG2E 160 LOG10E 161 PI 161 SQRT2 161 Math Methods 161 Arith me tic Methods 162 abs() 162 ceil() 162 floor() 162 log() 163 max(), min() 163 pow() 163 round() 163 sqrt() 164 Trig o no met ric Methods 164 cos() 164 An tique Book store Pro ject 166 Sum mary 168 Chap ter 14 Adding Plug-ins 169 Putting a Plug-in into Your HTML 169 Using Plug-ins in JavaScript 170 What Plug-ins are Al ready In stalled? 174 LiveAudio 175 An tique Book store Pro ject 179 Sum mary 179 Chap ter 15 Ob jects in JavaScript 181 Prop erties 181 Using prop er ties 181 Methods 182 Using Methods 183 Ob ject Ori ented Con cepts 183 Build ing Your Own Ob jects 184 Con struc tor Func tions 185 Sum mary 186 Chap ter 16 Tips and Tricks 187 Inline Frames 187 Browser De tec tion 189 Sys tem In for ma tion 189 viii n Con tents Find ing Mouse Lo ca tion 190 Pass word 191 Browser In for ma tion 191 Print ing the Page 192 An tique Book store Pro ject 192 View the Di rec tory 194 Sum mary 195 Chap ter 17 JavaScript Games 197 Press the But ton 197 Roll the Dice 200 Viva Las Ve gas 202 Sum mary 208 Chap ter 18 ActiveX and JavaScript 209 The o ret i cal Back ground 209 Using ActiveX for TCP/IP 210 Ticking Clock 212 Slider Text 213 Sum mary 215 Chap ter 19 Pro gramming and JavaScript 217 Gen eral Con cepts 217 Ar rays 218 Sum mary 221 Chap ter 20 An tique Book store Pro ject 223 The Main Screen 223 In ven tory Pages 227 Fin ishing the Pages 232 Sum mary 235 Ap pen dix A On line Re sources 237 JavaScript Web Sites 237 HTML Web Sites 238 Or ga ni za tional Web Sites 238 Im age Col lec tions 238 Cer tif i ca tion Web Sites 238 Em ploy ment Web Sites 239 Ap pen dix B HTML Ref er ence 241 Ba sic HTML Struc ture 241 Body For matting Tags 241 Im ages 241 Links 242 Lists 242 Mar quee 242 Ta bles 243 Con tents n ix Text For matting Tags 243 Form Tags 243 Ap pen dix C JavaScript Ref er ence 245 Ap pen dix D Com mon Er rors 251 In dex 253 x n Con tents [...]... Using Multiple scripts [JavaScript statements ] [JavaScript statements ] This is another script [JavaScript statements ] JavaScript Conventions There are sev eral con ven tions used to make JavaScript code more under standable Some of... sep a rate file Internal Scripts The tag is used to enclose JavaScript code in HTML doc u ments This is the most com mon way to include sim ple JavaScripts and it is the method we will use for most of this book Here is the gen eral syn tax: [JavaScript Statements ] The tag acts like all other HTML tags Notice that it must... Chapter 2 JavaScript Primer This book will teach you JavaScript by walk ing you step by step through the pro duc tion of a com plete web site How ever, to get you a jump start it is essen tial that you first have a basic grasp of JavaScript The goal of this chap ter is to intro duce you to the basic con cepts of JavaScript Each of the suc ces sive chap ters dis cusses a par tic u lar facet of JavaScript. .. web includ ing VBScript (based on the Visual Basic pro gram ming lan guage), CGI, and of course, JavaScript Below are two exam ples of JavaScripts inserted into HTML code document.write("") function makeDialogBox() { alert("Wonderful!") } Lists It is com mon to... Every state ment you put between the two tags will be inter preted as JavaScript code This is prob a bly the most com mon method for insert ing JavaScript into HTML documents JavaScript Primer n 15 The LANGUAGE attrib ute is used to spec ify the script ing lan guage At present, the tag sup ports var i ous lan guages includ ing JavaScript and VBScript Java-Script is the default script ing lan... lutely no prior knowl edge of JavaScript A basic work ing knowl edge of HTML is pre ferred but not essen tial The first two chap ters pro vide a basic intro duc tion on HTML and JavaScript The rest of the book takes you step by step through the pro cess of build ing an actual web site using both HTML and JavaScript How ever, the main empha sis of this book is teach ing you JavaScript After Chap ter 1... ure 2-1 JavaScript Primer n 19 2 Fig ure 2-1 This exam ple is OK, but I per son ally pre fer using JavaScript alert boxes So let us re-write Exam ple 2-1 using an alert box: Ex am ple 2-2 Hello Again! These two, very basic JavaScripts... JavaScripts should give you a feel for the lan guage, and hope fully whet your appe tite to learn more How ever, before we can delve into the excit ing world of build ing dynamic web sites with JavaScript, we need to cover the more mun dane fun da men tals of the lan guage 20 n Chapter 2 Fundamental JavaScript Concepts JavaScript is com posed of the same basic ele ments as all pro gram ming languages It... tion that JavaScript rec og nizes Compared to most pro gram ming lan guages, JavaScript has a small num ber of data types There are only four dif fer ent data types in JavaScript: num bers, strings, Boolean, and null val ues As opposed to other lan guages, a vari able data type is not declared explic itly but rather implic itly accord ing to its ini tial value assign ment Also unique to JavaScript. .. Note pad and WordPad on your PC; those are both fine for doing HTML and JavaScript The advan tage of using stan dard text edi tors is that they are free The dis ad van tage is that they do not offer any debug ging tools to 13 14 n Chapter 2 help you with the JavaScript I per son ally pre fer sim ply using Note pad for my HTML and JavaScript devel op ment Choosing a Browser Besides the basic pro gram . 18 Fun da men tal JavaScript Con cepts 20 Data Types and Vari ables in JavaScript 20 JavaScript Op er a tors 21 JavaScript State ments 23 Multiple Statements 23 Nested Statements 24 JavaScript Ex. 12 Strings in JavaScript 149 Chap ter 13 Math in JavaScript 157 Chap ter 14 Adding Plug-ins 169 Chap ter 15 Ob jects in JavaScript 181 Chap ter 16 Tips and Tricks 187 Chap ter 17 JavaScript Games. 2 JavaScript Primer 13 Es sen tial Tools 13 Choosing a Browser 14 Ba sic JavaScript Struc ture 14 The <SCRIPT> Tag 14 Internal Scripts 14 External Scripts 15 Placing JavaScript Code 15 JavaScript