Introduction to jQuery: Use jQuery to Write Simpler, Shorter, More Readable JavaScript Code
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Introduction
If you've ever tried writing more than a few lines of JavaScript code, you've probably noticed the annoying discrepancies between various browsers—and even various versions of the same browser. First-generation browser libraries (including the X library I've used in numerous articles published by InformIT) have provided a thin shim (recently remarketed as an adapter pattern) between the programmer and the browser idiosyncrasies, giving you a unified API that works with any supported browser. These libraries relieved the programmers' headaches, but did little to reduce the amount of repetitive JavaScript tasks (for example, navigating the DOM tree).
The second-generation libraries, including iQuery, Prototype, the Dojo Toolkit, and the Yahoo! User Interface library (YUI) provide a high-level approach to web page manipulation, finally allowing programmers to focus on the functionality of the web page, rather than the data traversal and manipulation details.
The jQuery and Prototype libraries offer similar functionality (although they also have some important differences), and your choice of one or the other would usually be influenced by other considerations; for example, existing code or knowledge of the project team. Not surprisingly, both are used by very large websites, some sites (Digg, for example) use both.
When I had to decide which library to choose, I leaned toward jQuery due to its support of CSS and XPath selectors (my websites rely heavily on both technologies) and the chaining concept, which allows you to write concise and easy-to-understand code.
This article will give you a very brief insight into the most important jQuery features and illustrate the drastic difference in code size and readability between traditional JavaScript libraries and jQuery.