When JavaScript first appeared in 1995, its main purpose was to handle some of the input validation that had previously been... more

When JavaScript first appeared in 1995, its main purpose was to handle some of the input validation that had previously been left to server-side languages such as Perl. Prior to that time, a round trip to the server was needed to determine if a required field had been left blank or an entered value was invalid. Netscape Navigator sought to change that with the introduction of JavaScript. The capability to handle some basic validation on the client was an exciting new feature at a time when use of telephone modems (operating at 28.8 kbps) was widespread. Such slow speeds turned every trip to the server into an exercise in patience.

Since that time, JavaScript has grown into an important feature of every major Web browser on the market. No longer bound to simple data validation, JavaScript now interacts with nearly all aspects of the browser window and its contents. Even Microsoft, with its own client-side scripting language called VBScript, ended up including its own JavaScript implementation in Internet Explorer from its very earliest version.

In this chapter, you will learn how and why JavaScript came about, from its humble beginnings to its modern-day, feature-packed implementations. To be able to use JavaScript to its full potential, it is important to understand its nature, history, and limitations. Specifically, this chapter examines:

• The origins of JavaScript and client-side scripting

• The different parts of the JavaScript language

• The standards related to JavaScript

• JavaScript support in popular Web browsers

... less

Some simple JavaScript functionality is easy to accomplish in the browser. Numerous articles on the Internet show you how... more

Some simple JavaScript functionality is easy to accomplish in the browser. Numerous articles on the Internet show you how to accomplish what many term “stupid Web tricks” using JavaScript. These tricks include how to pop up notices to the user, swap images, and create simple games. Although these are all interesting pieces of functionality to add to Web sites, copying and pasting code doesn’t provide an understanding of why or how something works. This chapter aims to provide you with a deeper knowledge base about how JavaScript works by examining its core, ECMAScript.

As described in the previous chapter, ECMAScript provides JavaScript with syntax, operators, and basic objects necessary to complete common programming tasks.

... less

ECMAScript objects are one of the unique (and useful) features of JavaScript. Chapter 2, “ECMAScript Basics,” introduced... more

ECMAScript objects are one of the unique (and useful) features of JavaScript. Chapter 2, “ECMAScript Basics,” introduced the concept that everything is an object, including functions. This chapter focuses on how to manipulate and use those objects, as well as how to create your own objects to add functionality specific to your needs.

... less

A truly object-oriented language must support inheritance, the capability of a class to reuse (inherit) methods and properties... more

A truly object-oriented language must support inheritance, the capability of a class to reuse (inherit) methods and properties from another class. In the previous chapter, you learned how to define properties and methods of a class, but what if you want two classes to use the same methods? This is where inheritance comes in.

... less

In the preceding chapters, you learned about JavaScript’s core, ECMAScript, and how the basics of the language work. Beginning... more

In the preceding chapters, you learned about JavaScript’s core, ECMAScript, and how the basics of the language work. Beginning with this chapter, the focus switches to using JavaScript inside its natural habitat: the Web browser.

Web browsers have come a long way since JavaScript was first introduced in Netscape Navigator 2.0. Browsers today are capable of handling a variety of file formats, not just conventional HTML. Ironically enough, JavaScript is used in most of these file formats as a way to dynamically change content on the client. This chapter explores how JavaScript fits into HTML and other languages, as well as introduces you to some basic concepts of the Browser Object Model (BOM).

... less

The Document Object Model (DOM) is perhaps the single greatest innovation on the Web since HTML was first used to connect... more

The Document Object Model (DOM) is perhaps the single greatest innovation on the Web since HTML was first used to connect related documents together over the Internet. The DOM gives developers unprecedented access to HTML, enabling them to manipulate and view HTML as an XML document. The DOM represents the evolution of Dynamic HTML, pioneered by Microsoft and Netscape, into a true cross-platform, language-independent solution.

... less

Once upon a time, testing for patterns contained within strings was an arduous process. It often involved using string functions... more

Once upon a time, testing for patterns contained within strings was an arduous process. It often involved using string functions such as charAt() and indexOf(). Languages such as Perl implemented a solution called regular expressions based on a Unix administration tools such as gred and ed.

Regular expressions are strings with a special syntax indicating the occurrence of specific characters or substrings within another string. These patterns range from very simple to very complicated and can be used to do anything from removing white space to validating credit card numbers.

JavaScript has natively supported regular expressions for longer than some high-powered languages, such as Java, which only introduced native regular expression support in JDK 1.4. Entire books are written on the subject of regular expressions because they can be very complicated; this chapter looks specifically at how JavaScript implements regular expressions

... less

A big part of Web programming is identifying target browsers and operating systems. Whether you are building a simple Web... more

A big part of Web programming is identifying target browsers and operating systems. Whether you are building a simple Web site or a complex Web application, this important information must be determined before any work begins. Because browsers support different levels of HTML and JavaScript, often differing across operating systems, you can save time and money by knowing your targets. This ensures that you won’t include features that aren’t available to your users.

Today, the challenge is even greater with the vast number of Web browsers available on so many different platforms. Windows users can use Internet Explorer, Mozilla, and Opera; Macintosh users have Internet Explorer, Mozilla, and now, Safari; Unix users can use Mozilla as well as Konqueror. Developing for all of them requires a great deal of forethought and a well-planned approach to dealing with their similarities and differences.

This chapter gives you an in-depth look at JavaScript browser and operating system detection to prepare you to develop cross-browser solutions.

... less

JavaScript’s interaction with HTML is handled through events that occur when the user or browser manipulates a page. When... more

JavaScript’s interaction with HTML is handled through events that occur when the user or browser manipulates a page. When the page loads, that’s an event. When the user clicks a button, that click, too, is an event. Developers can use these events to execute coded responses, which cause buttons to close windows, messages to be displayed to users, data to be validated, and virtually any other type of response imaginable to occur.

When events first appeared in browsers (IE 3.0 and Netscape Navigator 3.0), they focused on moving some server functionality to the client. At that time, the standard method for accessing the Internet was through a dial-up connection and modem. With speeds topping out at 56 kbps, each trip to the server could turn into minutes of down time.

JavaScript is designed to solve this problem by allowing such functionality to take place on the client, saving a trip to the server. As such, most of the early events centered on the use of forms and form elements, where simple validation could be more efficiently carried out. Through the years and browser versions, events continued to grow to support more of the page.

... less

Although the basic DOM is pretty straightforward, you can manipulate a document’s underlying DOM tree in several ways. First... more

Although the basic DOM is pretty straightforward, you can manipulate a document’s underlying DOM tree in several ways. First, you can make use of several nonstandard properties and methods available in modern browsers, as well as little-known and underused DOM standard interfaces.

This chapter highlights the browser features that make this possible. Some of the interfaces discussed in this chapter are defined by the DOM and some are not, but they all enhance your ability manipulate DOM documents and nodes.

... less

Form elements were created to address the need for the user to send data back to the server. The answer they provided came... more

Form elements were created to address the need for the user to send data back to the server. The answer they provided came in the form (no pun intended) of Web forms, using the HTML <form/>, <input/>, <select/>, and <textarea/> elements. Using these elements, browsers can render text boxes, combo boxes, and other user input controls to allow communication from the client to the server.

Although the Web has developed at a rapid pace, Web forms have remained virtually unchanged. Although a new standard called XForms looms on the horizon, no browser has made a move to adopt it natively, and so Web forms today rely on JavaScript to augment the built-in behavior.

In this chapter, you learn how to use JavaScript to extend the behavior and usability of common Web forms to include the functionality that today’s users expect.

... less

In most applications, sorting lists and tables is a normal procedure that you might use on a daily basis. When you checking... more

In most applications, sorting lists and tables is a normal procedure that you might use on a daily basis. When you checking your e-mail, you probably have the table set up to sort by descending order on the date column, placing the most recent e-mails at the top. It was only a matter of time before this paradigm made its way onto the Web.

Traditionally, sorting on the Web involves a round-trip to the server with the request indicating which column should be sorted and in what direction. However, JavaScript enables you to create the same functionality on the client. Using JavaScript, it’s possible to use sortable tables and also eliminate the need for costly server-side processing.

... less

One of the biggest improvements in computer usability was the proliferation of drag-and-drop behavior, allowing users to... more

One of the biggest improvements in computer usability was the proliferation of drag-and-drop behavior, allowing users to drag something from one spot on the screen and drop it somewhere else to either create an action or simply move the item. This paradigm, developed by XEROX, was first incorporated into consumer technology in Mac OS 1.0 and since that time has been incorporated in most personal computer operating systems (including Windows). When Dynamic HTML was first introduced, developers around the world starting experimenting with drag-and-drop functionality using JavaScript.

Drag and drop is a buzzword in usability, so adding this functionality to your Web site or Web application can win major points with customers and clients. At present time, you can accomplish drag and drop in two ways using JavaScript: system drag and drop and simulated drag and drop.

... less

Traditionally, JavaScript has been known as a language filled with confusing error messages such as Object Expected and Illegal... more

Traditionally, JavaScript has been known as a language filled with confusing error messages such as Object Expected and Illegal Syntax with nothing more than a line number to identify its origin. Debugging such messages was a painful experience at best, which is why the version 4 browsers (Internet Explorer 4.0 and Netscape Navigator 4.0) included some basic error-handling functionality. Shortly thereafter, an answer came from the ECMA in the form of ECMAScript, third edition.

This latest edition of ECMAScript added exception handling capabilities modeled after its big brother, Java. Using some of the reserved words from the second edition of ECMAScript, the third edition implements the try…catch…finally construct as well as the throw operator.

This chapter explores both the browser-based error-handling capabilities as well as ECMAScript’s exception-handling features.

... less

With the rising popularity of XML, JavaScript developers were clamoring for a way to make use of it in client-side Web development... more

With the rising popularity of XML, JavaScript developers were clamoring for a way to make use of it in client-side Web development. When the fourth-generation browsers were released, many developers began writing their own objects for the manipulation of XML using JavaScript. Hearing the call, some browser developers boldly pushed toward adding support for XML and XML-related language on the client side.

... less

Traditionally, JavaScript had no interaction with the server at all; it merely performed operations on the client and then... more

Traditionally, JavaScript had no interaction with the server at all; it merely performed operations on the client and then got out of the way to allow the server to do its job. As the Web progressed, however, JavaScript was required to send data back to the server and/or receive a response. This need led to several methods of establishing such communication.

... less

In the past two years, Web services have become a hot topic. Thanks to Microsoft’s .NET initiative, developers are now able... more

In the past two years, Web services have become a hot topic. Thanks to Microsoft’s .NET initiative, developers are now able to create, deploy, and access Web services quickly and easily. The idea is simple: Servers can provide (publish) Web services over the Internet. Any developer can access this functionality from a program, seamlessly providing the functionality encapsulated by the Web service. But Web services aren’t available only to compiled programs; they are also available to Web pages using JavaScript.

... less

The Web is much more than HTML and images. Today, Web sites across the world make use of many different types of plugins.... more

The Web is much more than HTML and images. Today, Web sites across the world make use of many different types of plugins. Plugins give Web browsers the capability to embed small (and sometimes large) programs or objects into a page without interfering with the underlying HTML. When a browser encounters content inside of an <object/> element, it hands over rendering responsibility to the associated plugin.

Originally, the plugin of choice was a Java applet. Applets allowed Web developers to include Java functionality directly in a Web page. Since that time, many more plugins have been developed. This chapter focuses on the most popular plugins used today and how you can use JavaScript to interact with them.

... less

So the JavaScript for your Web application or Web site has been coded, you’ve fully debugged it, and you've made sure that... more

So the JavaScript for your Web application or Web site has been coded, you’ve fully debugged it, and you've made sure that it works in each of your target browsers. The time is coming for deployment, and that introduces a whole host of new issues. Although you can test on various operating systems with various browsers, seemingly little things can cause unexpected browser behavior. It might be an operating system service pack; it could be a bug patch for a browser; or it could be a difference in cross-platform behavior. All these fall under the umbrella of deployment issues: things you need to worry about when setting up a system outside of your development environment.

... less

So far in this book, you have learned about the origins of JavaScript as well as about the implementations presently in use... more

So far in this book, you have learned about the origins of JavaScript as well as about the implementations presently in use. This chapter talks about what lies ahead for JavaScript. Since its introduction and the standardization of ECMAScript, JavaScript and derivative languages have been used in many different programming environments. But JavaScript hasn’t peaked: It’s still growing and evolving with several interested parties (such as Microsoft and Mozilla) pushing it forward. In this chapter, you learn where the evolution of JavaScript is heading and what this means to your code.

... less