Upgrade to Pro — share decks privately, control downloads, hide ads and more …

jquery.js

Avatar for iank_meong iank_meong
December 29, 2012
170
0

 jquery.js

mari sedikit bermain-main dengan javascript

Avatar for iank_meong

iank_meong

December 29, 2012

More Decks by iank_meong

See All by iank_meong
presentasi fisika
Avatar for iank_meong iankmeong
0
180
meong45
Avatar for iank_meong iankmeong
0
130

Featured

See All Featured
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k
How to make the Groovebox
Avatar for あそなす asonas
2
2.3k
16th Malabo Montpellier Forum Presentation
Avatar for AKADEMIYA2063 akademiya2063
PRO
0
330
Scaling GitHub
Avatar for Zach Holman holman
464
140k
The Mindset for Success: Future Career Progression
Avatar for Greg Gifford greggifford
PRO
0
440
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
240
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
380
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
37
7.4k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
5.1k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
301
52k
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
356
21k
Joys of Absence: A Defence of Solitary Play
Avatar for Sebastian Deterding codingconduct
1
430

Transcript

  1. JQuery Ibnu Yahya <[email protected]>

  2. Apa itu JQuery? • Javascript framework popular. • Menekankan bagaimana

    interaksi pada javascript dan html. • Berisi kumpulan library javascript siap pakai. • Memudahkan proses development web application.

  3. Mengapa JQuery? • Popular ◦ Google http://goo.gl/E7T3l ◦ http://trends.builtwith.com/javascript/jQuery •

    Dukungan dokumentasi • API yang lengkap (api.jquery.com) • Dapat digunakan di desktop maupun mobile web application Flash Problem?

  4. Bandingkan! Javascript yang diajarkan di sekolah

  5. Bandingkan! JQuery Javascript

  6. Konsep.... $(selector).action()

  7. Selector • Selector Element ◦ $("div").action(); (javascript) ◦ <div></div> (html)

    • Selector Class ◦ $(".saya").action(); (javascript) ◦ <div class="saya"></div> (html) • Selector ID ◦ $("#saya").action(); (javascript) ◦ <div id="saya"></div> (html) • Selector Attribute ◦ $("[attribute='value']").action(); (javascript) ◦ <div attribute="value"></div> (html)

  8. Action (JQuery API) • Event (http://api.jquery.com/category/events/) ◦ .click() ◦ .dblclick()

    ◦ .blur() • Attributes (http://api.jquery.com/category/attributes/) ◦ .html() ◦ .attr() ◦ .val • ETC (selengkapnya : api.jquery.com)

  9. Memulai Jquery <!DOCTYPE html> <head> <script type="text/javascript" scr="jquery.js"></script> <script> $(document).ready(function(){

    //jquery code }); </script> </head> <body> </body> </html>

  10. EXAMPLE <!DOCTYPE html> <head> <script type="text/javascript" scr="jquery.js"></script> <script> $(document).ready(function(){ $(".tambahtext").text("saya

    menambahkan text"); }); </script> </head> <body> <div class="tambahtext"></div> </body> </html>

  11. Pertanyaan?

  12. Terima Kasih