Top Banner
15
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Jquery
Page 2: Jquery

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

• References

Page 3: Jquery

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.

Page 4: Jquery

EventsEffects and animationsAjaxExtensibility through plug-insUtilities CompatibilityMulti-browser support.

Page 5: Jquery

• 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".

Page 6: Jquery

$(document).ready(function(){

   // jQuery functions go here...

});

Page 7: Jquery

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

:input $(":input") All input elements

:image $(":image") All input elements with type="image"

Page 8: Jquery

• 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!!});

Page 9: Jquery
Page 10: Jquery
Page 11: Jquery
Page 12: Jquery
Page 13: Jquery

•  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

Page 14: Jquery

Functionality maybe limitedJQueryjavascript file required

Page 15: Jquery

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