jQuery Mobile uses HTML 5 and CSS 3 features to enhance basic HTML markup to create a consistent mobile experience across supported platforms. jQuery Mobile makes heavy use of the HTML 5 specification for custom data- attributes (available for review at http://dev.w3.org/html5/spec/elements.html#embedding-custom-non-visible -data-with-the-data-attributes). Using this method, it is possible to embed data into valid HTML 5 markup. jQuery Mobile has a large vocabulary of data- attributes. Upon initialization, jQuery Mobile selects elements based on their data- attributes and enhances them by inserting extra markup, adding new CSS classes, and applying event handlers. This enables you to quickly write basic semantic markup and leave it to jQuery Mobile to transform your simple markup into complex user interface elements. It’s actually an interesting exercise to see what jQuery Mobile adds to your basic markup. To do this, you will need the ability to view source both before and after JavaScript has been applied to a page—in most browsers, the “view source” menu option will only show you the unenhanced source. However, most browsers have “view generated source” plug-ins available, and the ability to view generated source is built into some browser-based web development toolbars

2. • Introduction
• What is jQuery?
• Features
• Why jQuery ?
• jQuery Syntax
• jQuery Selectors
• jQuery Event Methods
• Examples
• Advantages
• Disadvantages
• References

3. jQuery is a lightweight, "write less, do more",
JavaScript library .
It was released in January 2006 at BarCamp NYC by
John Resig.
open-source JavaScript library that simplifies
interaction between HTML and JavaScript.
The purpose of jQuery is to make it much easier to
use JavaScript on your website.

4. Events
Effects and animations
Ajax
Extensibility through plug-ins
Utilities
Compatibility
Multi-browser support.

5. • Basic syntax is:
$(selector).action()
Examples:
• $(this).hide() - hides current element.
• $("p").hide() - hides all paragraphs.
• $("p.test").hide() - hides all paragraphs with class="test".
• $("#test").hide() - hides the element with id="test".

6. $(document).ready(function(){
// jQuery functions go here...
});

7. All type of selectors in jQuery, start with the dollar sign
and parentheses: $().
Selector Example Selects
#id $("#lastname") The element with
id="lastname"
.class $(".intro") All elements with class="intro“
:header $(":header") All header elements h1, h2 ...
:animated $(":animated") All animated elements
:hidden $("p:hidden") All hidden p elements
:button $(":button") All input elements with type="button"
p.intro $("p.intro") Selects all <p> elements with
class="intro"
:visible $("table:visible") All visible tables

8. • All the different visitors actions that a web page can
respond to are called events.
• Syntax For Event Methods
$("p").click(function()
{
// action goes here!!
});

13. • It’s lightweight, easy and fast
• Write less but do more
• Cross Browser Compatibility
• Separate javascript code from HTML mark-up
• Ajax support
• Open source library
• Cool Effects and Animations

14. Functionality maybe limited
JQueryjavascript file required

15. • Proctor, Paul E. The Practical jquery Handbook. New
Jersey: Prentice Hall PTR, 2001.
• Anderson J - An introduction to jquery - MIT Press 1995
• Jean,& Philippe. (2001). Application of jquery. Bethesda,
MD: SANS Institute. Retreivedfromhttp://
www.sans.org/reading-room/whitepapers/336.php
• Vigna, G., & Kemmerer, R.A. (1999). NetSTAT: A jquery.
Journal of Computer Security, 7 (1), 37--71.