Practical jQuery is your step-by-step guide to using jQuery in the real world, taking you from downloading jQuery all the way to extending it by writing your own plug-ins and testing the DOM using QUnit. jQuery is one of today's most popular JavaScript web application development frameworks and libraries. While getting started with the tool is easy, sometimes it's not as simple to completely realize the power and automation that it can bring to your development work—and that's especially the case when you're in the middle of a project, up against a deadline.
Using this book, you will learn how to use jQuery's powerful DOM manipulation tools to dynamically update content on your site. You will be able to extend jQuery's capabilities by writing your own plugins on top of the framework, animate elements, build your own jQuery elements, employ best practices, and avoid common errors. Practical jQuery teaches you how, with jQuery, you can unit test and refactor your code. You'll see how expressive yet concise jQuery's code is and how much quicker and efficient it is to develop with jQuery.
Get a fundamental perspective on how jQuery works, how to understand, select, and build your own plug-ins, and how to make sure your projects run at the peak of their potential performance using Practical jQuery today.
We previously stated that jQuery is a DOM manipulation library. So, keeping the current topic in sync with the heading, we will begin by demonstrating and explaining the most basic and common uses of jQuery. In the most basic of the scenarios, you would perform an action in jQuery, such as
$(selector).action();
Here starts the real lubrication of the jQuery machinery. Let us move toward analysis of the most basic usage that we just mentioned. We have outlined the syntax in list form, as follows:
The $ (dollar) sign is used to define and access jQuery. If we speak the language of commonly used OOP languages such as PHP, Java, or C++, we would say that the $ symbol is simply a variable in jQuery that represents the jQuery function as such. Another, simpler expression of this statement would be to state that the $ symbol is an alias of jQuery. To state the explanation even more clearly, using $(selector).action(); would have the same effect as using jQuery(selector).action();.
(selector) is used to query (or find) an HTML element. It can be any HTML element—a <p> or <h1> tag or even a <script> tag, and so on. Selectors are quite important to learn and master. If you have a working knowledge of how to use selectors, you will be able to drive through with great ease most of the web development problems you encounter. For the record, we explain selectors in detail in the next chapter.
action() is the jQuery action that must be performed on an element. By action, we mean an action to be performed, let’s say on a click event or a mouseout event. We will take up events in the coming chapters, so you can postpone worrying about not knowing about that concept for now.