★ jQuery Selectors are used to select one or a group of HTML elements from your web page.
★ jQuery support all the CSS selectors as well as many additional custom selectors.
★ jQuery selectors always start with dollar sign and parentheses: $()
★ There are three building blocks to select the elements in a web document.
Following are the ways to include jQuery in a page:
★ Local copy inside script tag
★ Local copy of script manager control
★ Embedded script using client script object
★ Remote copy of jQuery.com
★ Remote copy of Ajax API
★ Coding is simple, clear, reusable
★ Removal of writing more complex conditions and loops
Basic selectors in jQuery:
★ Element ID
★ CSS Name
★ Tag Name
★ DOM hierarchy
jQuery can be used in following scenarios:
★ Apply CSS static or dynamic
★ Calling functions on events
★ Manipulation purpose
★ Mainly for Animation effects
jQuery is great library for developing ajax based application.
It helps the programmers to keep code simple and concise and reusable.
★ To deal with cookies in jQuery we have to use the Dough cookie plugin.
★ Dough is easy to use and having powerful features.
Refer the following example:
★ this and $(this) references the same element but the difference is that "this" is used in traditional way but when "this" is used with $() then it becomes a jQuery object on which we can use the functions of jQuery.
★ In the example given, when only "this" keyword is used then we can use the jQuery text() function to get the text of the element, because it is not jQuery object. Once the "this" keyword is wrapped in $() then we can use the jQuery function text() to get the text of the element.
slideToggle() effect is used to give animated sliding effect to an element.
slideToggle([ duration] [, easing] [, callback])
"duration" is the number specifying how long the animation will run.
"easing" is the string which specify the function for the transition.
"callback" is the function which we want to run once the animation is complete.
If the element is visible then this effect will slide the element up side and make it completely hidden. If the element is hidden then slideToggle() effect will slide it down side and make it visible.
We can specify the toggle speed with this effect.
//run after the animation is complete.
The each() function specify the function to be called for every matched element.
$(selector).each(function (index, element))
"index" is the index position of the selector.
"selector" specifies the current selector where we can use "this" selector also.
In the case when we need to stop the each loop early then we can use "return false;"
This will write the text for each "li" element.