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
170
meong45
Avatar for iank_meong iankmeong
0
120

Featured

See All Featured
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
2
270
Skip the Path - Find Your Career Trail
Avatar for Mark Kilby mkilby
1
120
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k
Side Projects
Avatar for Sacha Greif sachag
455
43k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
So, you think you're a good person
Avatar for Per Axbom axbom
PRO
2
2k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.3k
A brief & incomplete history of 
UX Design for the World Wide Web: 1989–2019
Avatar for Jason CranfordTeague jct
2
370
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
187
22k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.7k
End of SEO as We Know It (SMX Advanced Version)
Avatar for Michael King ipullrank
3
4.2k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
320

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