A Brief Introduction to jQuery

Old presentation from the archives.

Transcript

1. Introduc)on  to  jQuery  
2. Overview  
3. Overview  
4. Non-­‐Pollu)ng   jQuery.noConflict();  
5. Small  Footprint   ~  19KB  (Minified  &  Gzipped)  
6. Cross  Browser  Compliant   A+
7. Extensible  
8. Selector  Performance  
9. Popularity  (Support  &  Innova)on)  
10. Simple  Premise   $(“#id”,  “div.class”)   .show()   .$(…)  
11. Chainability   $(“#id”)  .hide()   .width(300)  .fadeIn()  
12. The  jQuery  Object  
13. $(…)  The  jQuery  Func)on  
14. The  API  
15. Extending  
16. Custom  Filters   /*    *    jQuery  Input  Modified  Filter    */   $.extend($.expr[':'],  {                  modified:  func)on(el)  {                          return  $(el).is("input")  &&  el.defaultValue  !=  el.value;                  }   });     /*  Clear  all  modified  input  elements  */   $("input:modified")  .val(“”);  
17. Custom  Plugin   /*        *    jQuery  Zebra  Stripping  Plugin    */   jQuery.fn.zebra  =  funcQon(odd,  even)  {          return  this.find("tr:odd").css("background-­‐color",  odd)                  .end().find("tr:even").css("background-­‐color",  even);   }    //or  $.fn.extend({  zebra  :  funcQon(){…}  })     /*  Apply  Stripping  to  all  tables  in  DOM  */   $("table").zebra("#fff",  "#eee");  
18. Why  jQuery?  
19. vs.  
20. vs.  
21. vs.  
22. vs.  
23. vs.  
26. Ques)ons?