jQuery | jQuery Selectors
jQuery is a lightweight, "write less, do more",
JavaScript library.
The purpose of jQuery is to make it much easier to use JavaScript
on your website.
jQuery takes a lot of common tasks that requires many lines of JavaScript code to accomplish, and wraps it into methods that you can call with a single line of code.
jQuery takes a lot of common tasks that requires many lines of JavaScript code to accomplish, and wraps it into methods that you can call with a single line of code.
jQuery also simplifies a lot of the complicated things from
JavaScript, like AJAX calls and DOM manipulation.
The jQuery library contains the following features:
· HTML/DOM manipulation
· CSS manipulation
· HTML event methods
· Effects and animations
· AJAX
· Utilities
Why jQuery?
There are a lots of other JavaScript frameworks out there, but
jQuery seems to be the most popular, and also the most extendable.
Many of the biggest companies on the Web use jQuery, like:
· Google
· Microsoft
· IBM
· Netflix
Note: The purpose of jQuery is to make it much easier to use
JavaScript on your website.
jQuery Selectors
#
|
Syntax
|
Description
|
1.
|
$(this)
|
Current HTML element
|
2.
|
$(".intro")
|
All elements with
class="intro"
|
3.
|
$("#intro")
|
The first element with
id="intro"
|
4.
|
$("p")
|
All <p> elements
|
5.
|
$("p.intro")
|
All <p> elements with
class="intro"
|
6.
|
$("p#intro")
|
All <p> elements with
id="intro"
|
7.
|
$("p#intro:first-child")
|
The first <p> element with
id="intro"
|
8.
|
$("ul li:first-child")
|
The first <li> element of
each <ul>
|
9.
|
$("ul li:last-child")
|
The last <li> element of
each <ul>
|
10.
|
$("ul li:nth-child(4)")
|
The fourth <li> element of
each <ul>
|
11.
|
$("div#intro .head")
|
All elements with
class="head" and id="intro" of DIV
|
12.
|
$("[href*='User']")
|
All elements with href contains
"User"
|
13.
|
$("[href^='User']")
|
All elements with href start with
"User"
|
14.
|
$("[href$='.html']")
|
All elements with an href
attribute that ends with ".html"
|
15.
|
$("[href*='User'] div")
|
AND condition for Getting all
element which have href contains "User" and inner element div
|
16.
|
$("[href*='User'],div")
|
OR condition for Getting all
element which have href contains "User" or div element
|
17.
|
$("[href!='UserInfo.html']")
|
NOT condition for Getting all
element which have href not equle to "UserInfo.html"
|
18.
|
$("div > input#User")
|
Getting all element which have a
parent element is DIV and next element is INPUT have a id User
|
19.
|
$("div").find("input#User")
|
Getting all element of parent
element is DIV and child element is INPUT have a id User
|
20.
|
$("div").not(".UserInfo,
#UserId")
|
Getting all div element which not
have a class USERINFO or id is USERID
|
