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

jquery.js

Avatar for iank_meong iank_meong
December 29, 2012
0
160

 jquery.js

mari sedikit bermain-main dengan javascript

Avatar for iank_meong

iank_meong

December 29, 2012
Tweet

More Decks by iank_meong

See All by iank_meong
presentasi fisika
Avatar for iank_meong iankmeong
0
160
meong45
Avatar for iank_meong iankmeong
0
110

Featured

See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
113
20k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
31
6.1k
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
59
9.5k
Fireside Chat
Avatar for paigeccino paigeccino
39
3.6k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
74
5k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
2.8k
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
18
1.1k
Faster Mobile Websites
Avatar for Dean Hume deanohume
309
31k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
248
1.3M
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
90
590k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
126
17k

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