JQuery Selectors


What is jQuery? If you have not heard of jQuery or had a chance to check it out you really should. jQuery is designed to change the way that you write JavaScript.

Using Visual Quickstart Guide's jQuery book makes things really simple and easy to understand. For those of you who do not know jQuery is a JavaScript library that simplifies coding a lot. Because of some of the function in the jQuery library code that used to take up a quarter of the page can be simplified into 1 or 2 simple lines. On top of that there are some other really cool features that are a part of jQuery.

One of jQuery's specialties is letting you select page elements so you can work with them. Selecting page elements is a big part of online work. Until now almost all selection capabilities involved the getElementByID (), getElementsByName (), or some type of for each statement which all work but are limited, time consuming and take unnecessary overhead. jQuery on the other hand goes above and beyond these methods. In jQuery your able to select by descendants, by children, by specific text, by attribute, by attribute value, and even by position all by just one simple line of code changed based on what your selection.

For example lets say I want to select all the elements with a language attribute of Portuguese. In JavaScript the only way to do this would be to add an ID tag on each and every element with the language attribute of Portuguese, which may not seem like that big of deal but if you did not add it when you first programmed, it can be. In jQuery all I have to do is add this line of code:

$ ('p [language =' 'Portuguese'] ')

and then add the function or whatever action I want it to run. While it may not make things shorter it sure does simplify.

One of the most powerful selectors in my opinion is the 'checked selector, which lets you select checked boxes and selected radio buttons. Using this you can tell which elements are checked and which are not rather than the cumbersome "if value checked or if true" logic required prior to jQuery.

Here's a quick example:

Function count ()
alert ("You checked" +
$ ("input: checkeded"). length +

By entering this in a script tag and using the checked selector I can see how many check boxes were selected. The selectors in jQuery make it much easier to work online. I've talked about a few selectors here but there are so many more built into jQuery giving you a variety of ways to select elements.

If you're looking for a good book on jQuery you should check out Visual Quickstart Guide jQuery by Steven Holzner . Its provides a bunch of good examples.


Leave a Reply