JQuery introduction

1. – S. Pradeep Kumar

2. Why Third Party Library Cross Browser (W3C model & IE model)

3. Why jQuery ? Size and Speed

4. Write Less,Do More

5. jQuery

6. Selector Engine

7. Decorating $.addClass(),$.hasClass(),$.removeClass()

8. .css()

9. .height(),width(),innerHeight(),outerHeight()

10. .position(),offset()

11. Enhancing Html(),attr(),prop()

12. Add(),children(),closest(),filter(),find(),siblings(),prev(),next()

13. Events

14. DOM Ready function $(document).ready(function(){ Handler code------ });

15. (or)

16. $(function(){ handler code---- });

17. jQuery Event API $(selector).bind(“eventtype”handler)

18. Short cut's .click(),mousedown(),mousemove(),

19. mouseup()

20. Unbind(eventype,handler)

21. Advanced Events Support's event binding for elements added in future

22. Live() , die() (Chaining not supported)

23. Delegate() , Undelegate()

24. Custom events

25. Bind() , Trigger() (example hiding)

26. Passing the custom data with e.data

27. Playing with scope $.proxy(function,context);

28. Example setTimeOut(); setTimeout($.proxy( function (){ handler }, context ), delay);

29. AJAX

30. IE vs Firefox // Functions to create xhrs function createStandardXHR() { try { return new window.XMLHttpRequest(); } catch( e ) {} } function createActiveXHR() { try { return new window.ActiveXObject( "Microsoft.XMLHTTP" ); } catch( e ) {} }

31. Ajax API's $.ajax(url, beforesend:function(xhr){}, success:function(data){} ); $.get() to make a get request

32. $.post to make a post request

33. Types of Plugins jQuery selection or method functions plugin ($.fn.xxx equivalent to $.prototype), this allows to perform operation on set of elements (method plugins)

34. jQuery function plugins ($.xxx), this provide the additonal stand along functions (function plugins)

35. The first one returns the jQuery object and the other returns the jQuery object. First one supports chaining and other doesn’t

36. jQuery along with other libararies jQuery.noConflict()

37. Example is using the prototype.js

38. Points to remember Don't use if($(“selector”).api()) , instead check for the size

39. Always store you jQuery objects with name

40. $”varaibleName” (ex:$formElements)

41. Always follow Self executing single, self-executing function pattern

42. (function($) {})(jQuery);

43. References http://jqfundamentals.com/

44. http://jquery.com/

45. http://jqapi.com/

46. http://ejohn.org/

47. http://paulirish.com/

48. Assignments BorderLayout Plugin

49. ContentPanel Plugin

50. Css3 Editor with Preview

JQuery introduction

More Related Content

What's hot (20)

Viewers also liked (20)

Similar to JQuery introduction (20)

Recently uploaded (20)

JQuery introduction