home / software / tips and tricks / Chapter 5 - Selectors in jQuery

Chapter 5 - Selectors in jQuery

Updated:  06/15/2013 04:06 AM
Author:  Shiju Mathews

Status:    Resolved.


Chapter 5 - Selectors in jQuery
<<   Previous ChapterChaper 5Next Chapter >>
 

selectors allow you to select and manipulate HTML elements. jQuery selectors are used access HTML elements based on their id, classes, types, attributes, values of attributes etc.

All selectors in jQuery start with the dollar sign and parentheses: $().

Selecton by element:

element selector selects elements based on the element name.
You can select all elements on a page as : $("span")


#id Selector

The jQuery #id selector uses the id attribute of an HTML tag to find the specific element. An id should be unique within a page, so you should use the #id selector when you want to find a single, unique element.

To find an element with a id, write a hash character, followed by the id of the element in parentheses as $("#info").

class Selector

The jQuery class selector finds elements with a specific class name. To find elements with a specific class, write a period character, followed by the name of the class as $(".test")

Download Code sample

Untitled Page

More Examples of jQuery Selectors

Syntax Description
$("*") Selects all elements
$(this) Selects the current HTML element
$("p.info") Selects all <p> elements with class="info"
$("p:first") Selects the first <p> element
$("ul li:first") Selects the first <li> element of the first <ul>
$("ul li:first-child") Selects the first <li> element of every <ul>
$("[href]") Selects all elements with an href attribute
$("a[target='_blank']") Selects all <a> elements with a target attribute value equal to "_blank"
$("a[target!='_blank']") Selects all <a> elements with a target attribute value NOT equal to "_blank"
$(":button") Selects all <button> elements and <input> elements of type="button"
$("tr:even") Selects all even <tr> elements
$("tr:odd") Selects all odd <tr> elements


<<   Previous ChapterChaper 5Next Chapter >>
 
<
Tags: Chapter 5 - Selectors in jQuery
Updated on: March 2024