JavaScript A Beginners Guide 4/E

Home >
Browse >
JavaScript A Beginners Guide 4/E

JavaScript A Beginners Guide 4/E

Authors: John Pollock

Published: April 2013

eISBN: 9780071809382 0071809384 | ISBN: 9780071809375

Cover

Title Page

Copyright Page

About the Author

About the Technical Editor

Contents at a Glance

Contents

Acknowledgments

Introduction

What This Book Covers

Chapter 1: Introduction to JavaScript

What You Need to Know

Basic HTML and CSS Knowledge

Basic Text Editor and Web Browser Knowledge

Which Version?

Remember, It’s Not Java

Similarities to Other Languages

Beginning with JavaScript

Prototype-Based

Client-Side

Scripting Language

Putting It All Together

Online Resources

Try This 1-1: Use JavaScript to Write Text

Step by Step

Try This Summary

Chapter 1 Self Test

Chapter 2: Placing JavaScript in an HTML File

Using the HTML Script Tags

Identifying the Scripting Language

Calling External Scripts

Specifying When the Script Should Load

Using <noscript></noscript> Tags

Creating Your First Script

Writing a “Hello World” Script

Creating an HTML Document for the Script

Inserting the Script into the HTML Document

Try This 2-1: Insert a Script into an HTML Document

Step by Step

Try This Summary

Using External JavaScript Files

Creating a JavaScript File

Creating the HTML Files

Viewing the Pages in Your Browser

Try This 2-2: Call an External Script from an HTML Document

Step by Step

Try This Summary

Using JavaScript Comments

Inserting Comments on One Line

Adding Multiple-Line Comments

Chapter 2 Self Test

Chapter 3: Using Variables

Understanding Variables

Why Variables Are Useful

Variables as Placeholders for Unknown Values

Variables as Time-Savers

Variables as Code Clarifiers

Defining Variables for Your Scripts

Declaring Variables

Assigning Values to Variables

Naming Variables

Understanding Data Types

Number

String

Boolean

Null

Undefined

Try This 3-1: Declare Variables

Step by Step

Try This Summary

Using Variables in Scripts

Making a Call to a Variable

Adding Variables to Text Strings

Writing a Page of JavaScript

Creating the Framework

Defining the Variables

Adding the Commands

Modifying the Page

Try This 3-2: Create an HTML Page with JavaScript

Step by Step

Try This Summary

Chapter 3 Self Test

Chapter 4: Using Functions

What a Function Is

Why Functions Are Useful

Structuring Functions

Declaring Functions

Defining the Code for Functions

Naming Functions

Adding Arguments to Functions

Adding Return Statements to Functions

Calling Functions in Your Scripts

Script Tags: Head Section or Body Section

Calling a Function from Another Function

Calling Functions with Arguments

Calling Functions with Return Statements

Other Ways to Define Functions

Try This 4-1: Create an HTML Page with Functions

Step by Step

Try This Summary

Scope/Context Basics

Global Context

Function Context

Try This 4-2: Write Your Own Functions

Step by Step

Try This Summary

Chapter 4 Self Test

Chapter 5: JavaScript Operators

Understanding the Operator Types

Understanding Arithmetic Operators

The Addition Operator (+)

The Subtraction Operator (–)

The Multiplication Operator (*)

The Division Operator (/)

The Modulus Operator (%)

The Increment Operator (++)

The Decrement Operator (– –)

The Unary Plus Operator (+)

The Unary Negation Operator (–)

Understanding Assignment Operators

The Assignment Operator (=)

The Add-and-Assign Operator (+=)

The Subtract-and-Assign Operator (–=)

The Multiply-and-Assign Operator (*=)

The Divide-and-Assign Operator (/=)

The Modulus-and-Assign Operator (%=)

Try This 5-1: Adjust a Variable Value

Step by Step

Try This Summary

Understanding Comparison Operators

The Is-Equal-To Operator (==)

The Is-Not-Equal-To Operator (!=)

The Strict Is-Equal-To Operator (===)

The Strict Is-Not-Equal-To Operator (!==)

The Is-Greater-Than Operator (>)

The Is-Less-Than Operator (<)

The Is-Greater-Than-or-Equal-To Operator (>=)

The Is-Less-Than-or-Equal-To Operator (<=)

Understanding Logical Operators

The AND Operator (&&)

The OR Operator (||)

The NOT Operator (!)

The Bitwise Operators

Special Operators

Understanding Order of Operations

Try This 5-2: True or False?

Step by Step

Try This Summary

Chapter 5 Self Test

Chapter 6: Conditional Statements and Loops

Defining Conditional Statements

What Is a Conditional Statement?

Why Conditional Statements Are Useful

Using Conditional Statements

Using if/else Statements

Using the switch Statement

Using the Conditional Operator

User Input from a Prompt

Try This 6-1: Work with User Input

Step by Step

Try This Summary

Defining Loops

What Is a Loop?

Why Loops Are Useful

Using Loops

for

while

do while

for in and for each in

Using break and continue

Try This 6-2: Work with for Loops and while Loops

Step by Step

Try This Summary

Chapter 6 Self Test

Chapter 7: JavaScript Arrays

What Is an Array?

Why Arrays Are Useful

Defining and Accessing Arrays

Naming an Array

Defining an Array

Accessing an Array’s Elements

Using the length Property and Loops

Changing Array Values and Changing the Length

Try This 7-1: Use Loops with Arrays

Step by Step

Try This Summary

Array Properties and Methods

Properties

Methods

Nesting Arrays

Defining Nested Arrays

Loops and Nested Arrays

Try This 7-2: Nested Arrays Practice

Step by Step

Try This Summary

Chapter 7 Self Test

Chapter 8: Objects

Defining Objects

Creating Objects

Naming

Single Objects

Try This 8-1: Create a Computer Object

Step by Step

Try This Summary

Object Structures

Constructor Functions

Using Prototypes

Helpful Statements for Objects

The for-in Loop

The with Statement

Try This 8-2: Practice with the Combination Constructor/Prototype Pattern

Step by Step

Try This Summary

Understanding Predefined JavaScript Objects

The Navigator Object

The History Object

Chapter 8 Self Test

Chapter 9: The Document Object

Defining the Document Object

Using the Document Object Model

Using the Properties of the Document Object

Collections

The cookie Property

The dir Property

The lastModified Property

The referrer Property

The title Property

The URL Property

The URLUnencoded Property

Using the Methods of the Document Object

The get Methods for Elements

The open() and close() Methods

The write() and writeln() Methods

Using DOM Nodes

DOM Node Properties

DOM Node Methods

Try This 9-1: Add a DOM Node to the Document

Step by Step

Try This Summary

Creating Dynamic Scripts

Styles in JavaScript

Simple Event Handling

Coding a Dynamic Script

Try This 9-2: Try Out Property Changes

Step by Step

Try This Summary

Chapter 9 Self Test

Chapter 10: Event Handlers

What Is an Event Handler?

Why Event Handlers Are Useful

Understanding Event Handler Locations and Uses

Using an Event Handler in an HTML Element

Using an Event Handler in the Script Code

Learning the Events

The Click Event

Focus and Blur Events

The Load and Unload Events

The Reset and Submit Events

The Mouse Events

The Keyboard Events

Try This 10-1: Focus and Blur

Step by Step

Try This Summary

Other Ways to Register Events

The addEventListener() Method

The attachEvent() Method

The Event Object

DOM and Internet Explorer: DOM Level 0 Registration

Using event with Modern Event Registration

Properties and Methods

Event Information

Try This 10-2: Using addEventListener()

Step by Step

Try This Summary

Creating Scripts Using Event Handlers

Show Hidden Content

Change Content

Chapter 10 Self Test

Chapter 11: Window Object

Window: The Global Object

Using the Properties of the Window Object

The closed Property

The frames Property

The innerWidth and innerHeight Properties

The length Property

The location Property

The name Property

The opener Property

The parent, self, and top Properties

The status and defaultStatus Properties

Try This 11-1: Use the location and innerWidth Properties

Step by Step

Try This Summary

Using the Methods of the Window Object

The alert(), prompt(), and confirm() Methods

The find() Method

The home() Method

The print() Method

The setInterval() and clearInterval() Methods

The setTimeout() and clearTimeout() Methods

Try This 11-2: Use the setTimeout() and confirm() Methods

Step by Step

Try This Summary

The Main Window and New Windows

The Tale of Pop-up Windows

Opening New Windows

Closing New Windows

Moving, Resizing, and Scrolling New Windows

The resizeBy() and resizeTo() Methods

The scrollBy() and ScrollTo() Methods

Chapter 11 Self Test

Chapter 12: Math, Number, and Date Objects

Using the Math Object

What Is the Math Object?

How the Math Object Is Useful

Properties

Methods

Try This 12-1: Display a Random Link on a Page

Step by Step

Try This Summary

Understanding the Number Object

Properties

Methods

Using the Date Object

Properties and Methods

Methods That Get Values

Methods That Set Values

Other Methods

How About Some Date Scripts?

Try This 12-2: Create a JavaScript Clock

Step by Step

Try This Summary

Chapter 12 Self Test

Chapter 13: Handling Strings

Introduction to the String Object

The String Object

The String Literal

What’s the Difference?

Using the Properties and Methods of the String Object

The length Property

Methods of the String Object

Try This 13-1: Use indexOf() to Test an Address

Step by Step

Try This Summary

Using Cookies

Setting a Cookie

Reading a Cookie

Try This 13-2: Remember a Name

Step by Step

Try This Summary

Using Regular Expressions

Creating Regular Expressions

Testing Strings Against Regular Expressions

Adding Flags

Creating Powerful Patterns

Grouping Expressions

The replace(), match(), and search() Methods

More Information

Chapter 13 Self Test

Chapter 14: JavaScript and Forms

Accessing Forms

Using the forms Array

Using Form Names

Using an ID

Using the Properties and Methods of the Form Object

Properties

Methods

Ensuring the Accessibility of Forms

Using Proper Element and Label Order

Using <label></label> Tags

Using <fieldset></fieldset> Tags

Not Assuming Client-Side Scripting

Validation

Simple Validation

Techniques

Check Boxes and Radio Buttons

Try This 14-1: Request a Number

Step by Step

Try This Summary

HTML5 and Forms

New Elements

New Input Types

New Attributes

HTML5 Form Validation

Try This 14-2: Validate a Phone Number with HTML5 or JavaScript

Step by Step

Try This Summary

Chapter 14 Self Test

Chapter 15: An Introduction to Advanced Techniques

Working with Images

Rollovers

Try This 15-1: A More Accessible Rollover

Step by Step

Try This Summary

JavaScript and Frames

Purpose of Frames

Accessing Frames

Breaking Out of Frames

Debugging Scripts

Types of Errors

Alerts and Using the Console

Using a Lint Tool

Browser Developer Tools

JavaScript and Accessibility

Separate Content from Presentation

Enhancing Content

Try This 15-2: Make This Code Accessible

Step by Step

Try This Summary

JavaScript Security

Security and Signed Scripts

Page Protection

AJAX and JSON

AJAX

JSON

Chapter 15 Self Test

Chapter 16: JavaScript Libraries, HTML5, and Harmony

Using jQuery

Obtaining jQuery

Getting Started: document.ready()

Using Selectors

Altering Classes

Methods for Effects

Further Reading

Try This 16-1: Using jQuery to Create Effects

Step by Step

Try This Summary

Other JavaScript Libraries

jQuery Mobile

php.js

node.js

MooTools

Three.js

JavaScript and HTML5

The <canvas> Element

Drag and Drop

Try This 16-2: Drag and Drop

Step by Step

Try This Summary

ECMAScript Harmony

The const and let Keywords

Default Argument Values

Classes

More on Harmony

Further Reading

Need Help?

Chapter 16 Self Test

Appendix: Answers to Self Tests

Chapter 1: Introduction to JavaScript

Chapter 2: Placing JavaScript in an HTML File

Chapter 3: Using Variables

Chapter 4: Using Functions

Chapter 5: JavaScript Operators

Chapter 6: Conditional Statements and Loops

Chapter 7: JavaScript Arrays

Chapter 8: Objects

Chapter 9: The Document Object

Chapter 10: Event Handlers

Chapter 11: Window Object

Chapter 12: Math, Number, and Date Objects

Chapter 13: Handling Strings

Chapter 14: JavaScript and Forms

Chapter 15: An Introduction to Advanced Techniques

Chapter 16: JavaScript Libraries, HTML5, and Harmony

Index