Javascript & DOM #7 – DOM Events

Javascript & DOM #7 - DOM Events

Javascript & DOM #7 – DOM Events

Di video kali ini kita akan membahas mengenai EVENTS pada DOM.. materi yang sangat penting dari topik DOM kita ini.. Events membuat kita dapat melakukan apapun terhadap DOM yang sudah kita seleksi


DOWNLOAD SOURCE HTML
https://codepen.io/webprogrammingunpas/pen/vdGvRX


EVENTS DOM LENGKAP oleh MOZILLA
https://developer.mozilla.org/en-US/docs/Web/Events


PLAYLIST Javascript & DOM :
https://www.youtube.com/playlist?list=PLFIM0718LjIWB3YRoQbQh82ZewAGtE2-3


PLAYLIST LAIN:

– HTML Dasar
https://www.youtube.com/playlist?list=PLFIM0718LjIVuONHysfOK0ZtiqUWvrx4F

– CSS Dasar
https://www.youtube.com/playlist?list=PLFIM0718LjIUBrbm6Gdh6k7ZUvPIAZm7p

– Tutorial Sublime Text
https://www.youtube.com/playlist?list=PLFIM0718LjIWE-Ot9V9qcALx5OMAZY67c

– CSS Layouting
https://www.youtube.com/playlist?list=PLFIM0718LjIUu4Ju9GUL5zpLcuq08TKYr

– Dasar Pemrograman dengan JAVASCRIPT
https://www.youtube.com/playlist?list=PLFIM0718LjIWXagluzROrA-iBY9eeUt4w

– Belajar PHP untuk Pemula
https://www.youtube.com/playlist?list=PLFIM0718LjIUqXfmEIBE3-uzERZPh3vp6


MEDIA SOSIAL

http://instagram.com/sandhikagalih
https://www.facebook.com/WebProgrammingUNPAS
http://codepen.io/webprogrammingunpas
https://github.com/webprogrammingunpas
http://twitter.com/sandhikagalih


UNIVERSITAS PASUNDAN BANDUNG
http://www.unpas.ac.id/
http://www.if.unpas.ac.id/

terimakasih dan selamat #ngoding!

@sandhikagalih
Javascript & DOM #7 – DOM Events



Javascript & DOM #7 – DOM Events

Related posts

38 Thoughts to “Javascript & DOM #7 – DOM Events

  1. Mantap pak… selalu di tunggu-tunggu video nya pak 😀

  2. Semisal kita mau mengambil nilai variabel PHP untuk dikelola didalam Javascript apa bisa Pak?

    Jadi saya punya variabel $a yang isinya adalah:
    $a=$_GET['xxx'];

    Dan saya sudah punya 1 textfield atau 1 label.
    Yang saya inginkan, ketika saya hover mousenya diatas label atau textfield saya maka otomatis textfield saya langsung terisi nilai dari $a. Trimakasih.

  3. Om caranya klo saya punya dua project biar kita pncet projectnya itu buka tab baru lg . Itu gmna om? Makasih

  4. suka banget dg cara penyampaiannya. Kalem dan detail sedetailnya. Sukses gan.

  5. Pak, boleh request video tutorial 😀

  6. berharap banget bisa dibantuin..saya ingin membuat sound untuk vocabulary, beda tombol beda juga yang diucapkan sesuai kata yang ada di span. tapi saya ngga tau ngubah scripptnya. tolong dibantu ya kang.. ini scriptnya:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <Title>Text To Speech</title>
    </head>
    <body>

    <h3>ketik apa ajah yang kamu mau</h3>

    <!– saya ingin membuat sound untuk vocabulary, beda tombol beda juga yang diucapkan sesuai kata yang ada di span. tapi saya ngga tau ngubah scripptnya. tolong dibantu ya kang –>
    <a href="#" class="say"><button>H</button></a>
    <span id="ok"> dog </span><br>
    <a href="#" class="say"><button>H</button></a>
    <span id="oc"> cat</span><br>
    <a href="#" class="say"><button>H</button></a>
    <span id="oc"> fish</span><br>

    <audio src="" class="speech" hidden></audio>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script&gt;

    <script>
    $(function() {
    $('a.say').on('click',function(e){
    e.preventDefault();
    var ki= $('#ok').text();
    ki = encodeURIComponent(ki);
    console.log(ki);
    var url = "http://translate.google.com/translate_tts?tl=en&q=" + ki + "&client=tw-ob";
    $('audio').attr('src', url).get(0).play();
    });
    });
    </script>
    </body>
    </html>

  7. DOM Traversal tuh yg kaya gimana pak Dhika :/ ?

  8. bisa buat video tentang node js?

  9. Kang, jelasin setter dan getter dong

  10. Anonymus function, callback function, closure. Masih bingung dgn konsep ini

  11. Tutorial Framework dong mas 🙁

  12. makin ngerti pak dika hehehe…

  13. Pak, jika object tabel. Salah satu field record, misalnya record ke 5 diklik, langsung pindah halaman yg lain bagaimana…?

  14. Pak tanya minimal spesifikasi laptop buat programing seperti apa?

  15. pak dika gimana ya menggabungkan event keyup format angka ke rupiah dan penjumlahan otomatis di dalam sebuah form? udah coba cara ke duanya dari event handler tapi belum juga cocok logikanya. 🙁

  16. Pak Dika tolong bikin pembahasan HISTORY API (pushstate, replacestate, dsb) + dikombinasi sama AJAX.. 😀

  17. Hadir,,, Mantap…. sehat and suksess selalu

  18. addEventListener 12:54
    Perbedaan EventHandler vs addEventListener 17:42
    Event List 21:11

  19. Pak Dhika. Semoga sehat selalu. Saya mau buat form input autocomplete. Tetapi sumber datanya dari database. Contoh sumber datanya di javascript :

    var countries = ["Afghanistan","Albania","Algeria","Andorra","Angola","Anguilla","Antigua & Barbuda","Argentina","Armenia","Aruba","Australia","Austria","Azerbaijan","Bahamas","Bahrain","Bangladesh","Barbados","Belarus","Belgium","Belize","Benin","Bermuda","Bhutan","Bolivia","Bosnia & Herzegovina","Botswana","Brazil","British Virgin Islands","Brunei","Bulgaria","Burkina Faso","Burundi","Cambodia","Cameroon","Canada","Cape Verde","Cayman Islands","Central Arfrican Republic","Chad","Chile","China","Colombia","Congo","Cook Islands","Costa Rica","Cote D Ivoire","Croatia","Cuba","Curacao","Cyprus","Czech Republic","Denmark","Djibouti","Dominica","Dominican Republic","Ecuador","Egypt","El Salvador","Equatorial Guinea","Eritrea","Estonia","Ethiopia","Falkland Islands","Faroe Islands","Fiji","Finland","France","French Polynesia","French West Indies","Gabon","Gambia","Georgia","Germany","Ghana","Gibraltar","Greece","Greenland","Grenada","Guam","Guatemala","Guernsey","Guinea","Guinea Bissau","Guyana","Haiti","Honduras","Hong Kong","Hungary","Iceland","India","Indonesia","Iran","Iraq","Ireland","Isle of Man","Israel","Italy","Jamaica","Japan","Jersey","Jordan","Kazakhstan","Kenya","Kiribati","Kosovo","Kuwait","Kyrgyzstan","Laos","Latvia","Lebanon","Lesotho","Liberia","Libya","Liechtenstein","Lithuania","Luxembourg","Macau","Macedonia","Madagascar","Malawi","Malaysia","Maldives","Mali","Malta","Marshall Islands","Mauritania","Mauritius","Mexico","Micronesia","Moldova","Monaco","Mongolia","Montenegro","Montserrat","Morocco","Mozambique","Myanmar","Namibia","Nauro","Nepal","Netherlands","Netherlands Antilles","New Caledonia","New Zealand","Nicaragua","Niger","Nigeria","North Korea","Norway","Oman","Pakistan","Palau","Palestine","Panama","Papua New Guinea","Paraguay","Peru","Philippines","Poland","Portugal","Puerto Rico","Qatar","Reunion","Romania","Russia","Rwanda","Saint Pierre & Miquelon","Samoa","San Marino","Sao Tome and Principe","Saudi Arabia","Senegal","Serbia","Seychelles","Sierra Leone","Singapore","Slovakia","Slovenia","Solomon Islands","Somalia","South Africa","South Korea","South Sudan","Spain","Sri Lanka","St Kitts & Nevis","St Lucia","St Vincent","Sudan","Suriname","Swaziland","Sweden","Switzerland","Syria","Taiwan","Tajikistan","Tanzania","Thailand","Timor L'Este","Togo","Tonga","Trinidad & Tobago","Tunisia","Turkey","Turkmenistan","Turks & Caicos","Tuvalu","Uganda","Ukraine","United Arab Emirates","United Kingdom","United States of America","Uruguay","Uzbekistan","Vanuatu","Vatican City","Venezuela","Vietnam","Virgin Islands (US)","Yemen","Zambia","Zimbabwe"];

    Saya ingin sumber data diatas berasal dari database mysql. Minta SOLUSI pak Dhika.

  20. Pak sandhika, mw tanya. Untuk menghapus element li tertentu diklik pake for loop gak bisa, tapi saat for loop memunculkan alert pada li tertentu bisa. Tolong solusinya pak. Terima kasih

  21. Pak saya mau nanya mengenai materi event ini, kalo semisal kita buat event untk menambah element seperti paragraf baru seandainya kita klik hingga 5x paragraf pun akan muncul sebanyak 5x tp seandainya kita refresh maka paragraf tsb akan hilang. gmn caranya agar ketika direfresh paragraf tsb tidak akan hilang alias stay trhdp tag parentnya tsb. trmksh pak, mohon minta pencerahannya 🙂

  22. Pak dika .Cara Gunain Events Focus Buat Form Input . Mohon bantuanya .

  23. Pak kenapa harus membuat anonymous function lagi dimenit 20:20 . Padahal kalo p3.style.color nya ditaruh didalam satu function dengan p3.style.backgroundColor itu bisa dijalankan ke-duanya tanpa harus ada yang kena timpa.

  24. menit ke 17:15 sudah ku coba, ku ikuti dan ku ketik ulang tapi kenapa ngga muncul item baru di section b nya ya?? Huhu 🙁

  25. mantap pak. hatur nuhuuuuuunnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn 🙂

  26. sangat bermanfaat, terima kasih pak 🙂

  27. Pak,saat saya lihat modal bootstrap pada website modern saat ini ketika di infect element tidak terlihat element tentang modal,tapi pada saat modal diaktifkan barulah muncul element untuk modal itu.maaf pak,ini metode nya gimana ya pak?

  28. semakin menemukan titik terang..heheheee

  29. Kenapa pas habus nge bind
    const p3 = document.querySelector('.p3');
    p3 nya gak bisa dikasih style ya ???

  30. Terima Kasih Ilmunya Mahal banget Pak

Leave a Comment