Absolute Software Dennis Loktionov jQuery: Write Less. Do More.
Overview
Core Concepts <ul><ul><li>Closures </li></ul></ul><ul><ul><li>Self-invoking functions </li></ul></ul><ul><ul><li>Method ch...
Philosophy <ul><ul><li>Focus on interaction between JavaScript and HTML </li></ul></ul><ul><ul><li>Every operation boils d...
Selectors <ul><ul><li>CSS 3 (#id, tag, .class, parent > child, etc.)  </li></ul></ul><ul><ul><li>XPath  </li></ul></ul><ul...
Object Accessors <ul><ul><li>each(callback) </li></ul></ul><ul><ul><li>eq(position) </li></ul></ul><ul><ul><li>get() </li>...
Events <ul><ul><li>ready(fn) </li></ul></ul><ul><ul><li>bind(type, data, function) </li></ul></ul><ul><ul><li>one(type, da...
AJAX <ul><ul><li>$.ajax(options) </li></ul></ul><ul><ul><li>$.get(URL, data, callback) </li></ul></ul><ul><ul><li>$.getJSO...
Visual Effects <ul><ul><li>show (timeout, callback) </li></ul></ul><ul><ul><li>hide (timeout, callback) </li></ul></ul><ul...
Sites Using jQuery <ul><ul><li>Google </li></ul></ul><ul><ul><li>IBM </li></ul></ul><ul><ul><li>Dell, Inc. </li></ul></ul>...
Competitors <ul><ul><li>Prototype </li></ul></ul><ul><ul><li>Yahoo! UI </li></ul></ul><ul><ul><li>Dojo </li></ul></ul><ul>...
Further Reading <ul><ul><li>http://jquery.com  - jQuery official website </li></ul></ul><ul><ul><li>http://visualjquery.co...
The End <ul><ul><li>THANKS </li></ul></ul>
Upcoming SlideShare
Loading in...5
×

jQuery. Write less. Do More.

1,353

Published on

jQuery presentation

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,353
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
54
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

jQuery. Write less. Do More.

  1. 1. Absolute Software Dennis Loktionov jQuery: Write Less. Do More.
  2. 2. Overview
  3. 3. Core Concepts <ul><ul><li>Closures </li></ul></ul><ul><ul><li>Self-invoking functions </li></ul></ul><ul><ul><li>Method chaining </li></ul></ul><ul><ul><li>Implicit iterators </li></ul></ul><ul><ul><li>Namespace isolation </li></ul></ul>
  4. 4. Philosophy <ul><ul><li>Focus on interaction between JavaScript and HTML </li></ul></ul><ul><ul><li>Every operation boils down to 2 things: </li></ul></ul><ul><ul><ul><ul><li>Find some stuff </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Do something with it </li></ul></ul></ul></ul>
  5. 5. Selectors <ul><ul><li>CSS 3 (#id, tag, .class, parent > child, etc.) </li></ul></ul><ul><ul><li>XPath </li></ul></ul><ul><ul><li>Custom (:odd, :even, :hidden, :visible, etc.) </li></ul></ul><ul><ul><li>Basics </li></ul></ul>Action JavaScript jQuery Select an element by id document.getElementById(“id”) $(“#id”) Select element by tag name document.getElementByTagName(“div”); $(“div”) Select elements by name document.getElementsByName(“elem”) $(“*[name='elem']”)
  6. 6. Object Accessors <ul><ul><li>each(callback) </li></ul></ul><ul><ul><li>eq(position) </li></ul></ul><ul><ul><li>get() </li></ul></ul><ul><ul><li>get(index) </li></ul></ul><ul><ul><li>index(subject) </li></ul></ul><ul><ul><li>length() </li></ul></ul>
  7. 7. Events <ul><ul><li>ready(fn) </li></ul></ul><ul><ul><li>bind(type, data, function) </li></ul></ul><ul><ul><li>one(type, data, function) </li></ul></ul><ul><ul><li>trigger(type, data) </li></ul></ul><ul><ul><li>unbind(type, data) </li></ul></ul><ul><ul><li>Mouse events </li></ul></ul><ul><ul><li>Keyboard events </li></ul></ul><ul><ul><li>toggle(fn1, fn2) </li></ul></ul>
  8. 8. AJAX <ul><ul><li>$.ajax(options) </li></ul></ul><ul><ul><li>$.get(URL, data, callback) </li></ul></ul><ul><ul><li>$.getJSON(URL, data, callback) </li></ul></ul><ul><ul><li>$.load(URL, data, callback) </li></ul></ul><ul><ul><li>$.post(URL, data, callback, type) </li></ul></ul>
  9. 9. Visual Effects <ul><ul><li>show (timeout, callback) </li></ul></ul><ul><ul><li>hide (timeout, callback) </li></ul></ul><ul><ul><li>slideDown(speed, callback), slideUp (speed, callback) </li></ul></ul><ul><ul><li>fadeIn, fadeOut </li></ul></ul><ul><ul><li>animate (params, options) </li></ul></ul><ul><ul><li>etc. </li></ul></ul>
  10. 10. Sites Using jQuery <ul><ul><li>Google </li></ul></ul><ul><ul><li>IBM </li></ul></ul><ul><ul><li>Dell, Inc. </li></ul></ul><ul><ul><li>Bank of America </li></ul></ul><ul><ul><li>Reuters </li></ul></ul><ul><ul><li>BBC </li></ul></ul><ul><ul><li>Amazon </li></ul></ul><ul><ul><li>Intel </li></ul></ul><ul><ul><li>Oracle </li></ul></ul><ul><ul><li>Mozilla </li></ul></ul><ul><ul><li>Slashdot </li></ul></ul><ul><ul><li>… and thousands of others </li></ul></ul>
  11. 11. Competitors <ul><ul><li>Prototype </li></ul></ul><ul><ul><li>Yahoo! UI </li></ul></ul><ul><ul><li>Dojo </li></ul></ul><ul><ul><li>mooTools </li></ul></ul><ul><ul><li>Google Toolkit </li></ul></ul>
  12. 12. Further Reading <ul><ul><li>http://jquery.com - jQuery official website </li></ul></ul><ul><ul><li>http://visualjquery.com - Interactive jQuery tutorial </li></ul></ul><ul><ul><li>http://snurl.com/6yalw - 50 jQuery examples </li></ul></ul><ul><ul><li>http://plugins.jquery.com - jQuery plugins </li></ul></ul><ul><ul><li>http://snurl.com/6yamw Comparison of JavaScript frameworks </li></ul></ul>
  13. 13. The End <ul><ul><li>THANKS </li></ul></ul>
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×