Saturday 23 February 2013

jQuery | jQuery Selectors

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 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

No comments:

Post a Comment

Internet Marketing Researcher in India | Web Marketing Consultant