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
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
83
9.1k
Building Adaptive Systems
Avatar for Chris Keathley keathley
43
2.7k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
231
18k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
46
7.6k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
64
7.9k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
1.4k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
9
780
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
45
7.6k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
614
210k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
8
480

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