JQUERY Selectors

Click Here

The are used to select the element or elements on which to perform an action.

To select an item or items, you can use any CSS selectors, such as: identifiers (id), classes (class), tags (h1, h2, p, ..), attributes, attribute values, etc..

JQUERY Selectors Examples

1.- To select all the <p> tags in the HTML document

HTML code

<p>This is a paragraph </p>

JQUERY code to select those elements

$("p")

2.- To select the elements with id = "dat", use "#"

HTML code

<p id="dat">This is a sample paragraph </p>

JQUERY code

$("#dat")

3.- To select elements with class = "dat", use "."

HTML code

<p class="dat">This is a paragraph </p>

JQUERY code

$(".dat")

4.- To select all items in an HTML document, use "*"

HTML code

<h1>Proprietor of the page </h1>
<p>This is the first paragraph </p>
<p id="2">This is the second paragraph </p>

JQUERY code

$("*")

5.- To select the current item, use "this"

HTML code

<p>Click on this paragraph <p>

JQUERY code

$(this)

6.- To select items with a "href" attribute, use "[]"

HTML code

<a href="www.example.com/jquery1.htm">Example jquery </a>

JQUERY code

$("[href]")

7.- To select all elements that are empty, use "empty"

HTML code

<input name="mail" value="">
<p></p>

JQUERY code

$(":empty")

8.- To select all elements of type = "text"

HTML code

<input type="text" name="field1">

JQUERY code

$(":text")

Click Here