Wednesday, June 10, 2009

jQuery selectors are one of the most important aspects of the jQuery library. These selectors use familiar CSS syntax to allow page authors to quickly and easily identify any set of page elements to operate upon with the jQuery library methods. Understanding jQuery selectors is the key to using the jQuery library most effectively. This reference card puts the power of jQuery selectors at your very fingertips.

Complete Selectors List

Selector: Element
Example: $("td")
Description: Select an HTML element tag

Selector: #id
Example: $("#divMessage")
Description: Selects an element by its id

Selector: .cssclass
Example: $(".gridalternate")
Description: Selects a CSS style

Selector: selector,selector
Example: $("input:button,input:text")
Description: Multiple comma separated selectors can be combined into a single selection.

Selector: ancestor descendant
Example: $("#divMessage a")
Description: A space between selectors/elements/tags finds nested elements. This syntax is similar to Css ancestor descendant syntax.

Selector: parent > child > child
Example: $("p > b")
Description: Matches all immediate children of an element or selector expression that match the right element/selector.

Selector: prev ~ siblings ~ siblings
Example: $("#row_11:nth-child(2)~td")
Description: Matches the next siblings at the sample level as the preceeding expression. Example, matches 3-nth columns of a table row. Best used as a find() or filter() against an existing jQuery instance.

Selector: prev + nextsibling + nextsibling
Example: $("#tdMoneyCol+td")
Description: Matches the following sibling. Works best with find() or filter() against an existing jQuery object.

Selector: filter
Example: $("input:button")
Description: applies filters to the query. jQuery support CSS 3 filters plus a number of custom filters.
Examples: :not,:button,:visible,:hidden,:checked,:first,nth-child(1),:has,:is,:contains,:parent

Selector: [@attribute]
Example: $("p[class=gridalternate]
Description: Selects an attribute of an element
= equals string
^= startswith
$= endswith
*= contains

Tuesday, June 9, 2009

jQuery Introduction

What is jQuery?

jQuery is great library for developing ajax based application. jQuery is great library for the JavaScript programmers, which simplifies the development of web 2.0 applications. You can use jQuery to develop cool web 2.0 applications. jQuery helps the programmers to keep code simple and concise. The jQuery library is designed to keep the things very simple and reusable.
jQuery library simplifies the process of traversal of HTML DOM tree. You can use jQuery to handle events, perform animation, and add the ajax support into your web applications with ease.

The jQuery JavaScript library "tries to treat its users with a sense of respect," simplifies development and makes coding fun, its creator says.

John Resig, the creator of jQuery , said the technology reached its 1.0 release on Aug. 26. jQuery is essentially a new type of JavaScript library that allows developers to work "unobtrusively" with JavaScript.

The word "query" in the library's name says it all. It refers to running queries over the DOM of the page, which is where jQuery gets its power.

Features of jQuery

  • DOM element selections functions
  • DOM traversal and modification
  • Events
  • CSS manipulation
  • Effects and animations
  • Ajax
  • Extensibility
  • Utilities - such as browser version and the each function.
  • JavaScript Plugins

Visit (official jQuery website) for any references


  1. jQuery version 1.3.2 (latest release-MINIFIED version)
  2. jQuery version 1.3.2 (latest release-DEVELOPMENT version)
  3. Any Other specific version