Belajar pengenalan jquery dasar

Belajar JQuery Part 2 : Belajar Pengenalan JQuery Dasar


Belajar Pengenalan JQuery Dasar

Setelah mempelajari tentang pengertian dan cara menggunakan jquery yang sudah di jelaskan tentang cara menghubungkan file jquery dengan HTML atau PHP di tutorial sebelumnya di www.malasngoding.com. maka pada tutorial kali ini akan di jelaskan tentang belajar pengenalan jquery dasar. untuk penulisan syntax jquery sama seperti javascript. bisa di tuliskan dalam satu file dengan file html atau php, dan bisa juga menulisakan syntax jquery secara external atau meletakkan syntax jquery pada satu file .js dan kemudian menghubungkannya dengan file html atau php anda.

Sebelum lebih jauh melangkah tentang tutorial jquery ada baiknya pada tutorial jquery dasar ini di jelaskan terlebih dahulu tentang apa itu selector ? dan apa itu event pada jquery ? untuk penjelasan mengenai selector dan event pada jquery silahka perhatikan penjelasan berikut.

Pengertian Selector JQuery

selector dapat di katakan sebagai pemilih. dalam artian kata pemilih di sini ialah pemilihan terhadap element HTML yang akan di berikan method event atau aksi oleh si JQuery. seperti yang sudah kita pelajari pada tutorial dasar HTML di www.malasngoding.com tentang mengenal selector pada html yaitu class dan id. yang mana class di panggil dengan cara memberikan tanda titik (.) dan id di panggil dengan cara menggunakan tanda pagar (#).

Pengertian Event JQuery

Event merupakan method atau aksi yang di lakukan oleh JQuery. contohnya seperti menambah element, menyembunyikan element, menampilkan element, mengambil data pada atribut element dan lainnya seperti yang dapat di lakukan oleh javascript yang telah kita pelajari pada tutorial javascript dasar di www.malasngoding.com. event di tetapkan pada saat setelah menetapkan selector yang ingin di berikan method atau aksi oleh jquery.

Perhatikan contoh selector dan event pada jquery berikut ini.

di sini saya akan mencoba membuat sebuah contoh tentang penggunaan dasar pada jquery. sediakan sebuah file php atau html. di sini saya menggunakan file html dengan nama index.html. file style.css dan kemudian sediakan library jquery yang sudah di jelaskan cara mendownload dan menghubungkannya pada tutorial sebelumnya di www.malasngoding.com. klik di sini untuk melihat tutorial belajar dasar jquery part 1 : pengertian dan cara penggunaan jquery.

index.html

style.css

dapat di perhatikan pada contoh di atas bahwa saya telah membuat sebuah element yang saya beri tanda dengan class yang bernama class ‘box’. dan membuat sebuah tombol yang saya beri tanda dengan id ‘tombol’.

dan yang terpenting perhatikan pada contoh jquery di atas

syntax

di gunakan untuk memberitahukan bahwa jquery akan di jalankan pada saat halaman sudah siap di load penuh 100%.  dan penjelasan secara keseluruhannya berarti aksi jquery akan di jalankan jika halaman sudah benar-benar siap. dan pada

syntax di atas memerintahkan untuk memberikan aksi atau event untuk element yang ber id tombol (tombol) di klik. pada contoh ini untuk lebih memperjelas tentang selector dan event jquery berarti selector di sini adalah id tombol yang di panggil dengan “#tombol” dan class box yang di panggil dengan “.box”. toggle() adalah sebuah efek jquery untuk menampilkan dan menyembunyikan element yang sudah di tentukan. pada contoh di atas element yang di tampilkan dan di sembunyikan saat tombol di klik adalah element yang memiliki class box.

belajar pengenalan jquery dasar

belajar pengenalan jquery dasar

event click() hanyalah salah satu dari event di jquery, ada banyak event lainnya yang akan kita pelajari pada tutorial belajar jquery dasar selanjutnya di www.malasngoding.com. pada tutorial jquery selanjutnya akan di jelaskan juga tentang event dan efek lainnya dari jquery. silakan klik pada tombol pada contoh demo berikut berikut untuk melihat efek toggle() jquery seperti yang sudah di pelajari pada tutorial ini tentang belajar pengenalan jquery dasar.

See the Pen qbRqQq by Malas Ngoding (@malasngoding) on CodePen.0

 

Terima kasih ..

Incoming search terms:

  • script dasar jquerymobile
  • belajar jquery event
  • aksi yg digunakan jquery
  • cara download jqueey
  • contoh script dasar JQueryMobilr
  • dasar dasar jquery ajax pemula
  • script dasar jquery mobile
  • pengenalan jquery easul
  • dasar jquery
  • sintak sintak jquery




About the author
Diki Alfarabi Hadi

Coding enthusiast. Someone who love learn something new. especially about web programming and web design. happy to share about knowledge and learn from other.


Discussion
  • 3 Comments
  • […] membelajari dasar-dasar JQuery pada tutorial sebelumnya di http://www.malasngoding.com yaitu tutorial belajar Pengenalan Jquery dasar yang telah membahas tentang pengertian event dan selector pada jquery. silahkan baca tutorial […]


  • […] Oke teman-teman. sesuai dengan judul pada artikel ini “Membuat Form Validasi Sendiri Dengan JQuery Tanpa Plugin“. di kesempatan kali ini saya akan membahas tentang bagaimana sih cara membuat form validation sendiri. tanpa menggunakan library jquery yang lainnya seperti jquery.validate.js. tetapi kita hanya akan menggunakan jquery.js saja. oh ya jika teman-teman ada yang belum mempelajari tentang tutorial jquery dasar, teman-teman bisa langsung membaca tutorial jquery yang sudah kita bahas sebelumnya : Belajar Pengenalan Jquery Dasar. […]


  • Arif Ikhsanudin 3 months ago

    kode diatas yang index.html ada salah sedikit disini

    $(document).ready(function() {
    $(‘#tombol’).click(function() { // tombol seharusnya pakai # bukan . (titik)
    $(‘.box’).toggle();
    });
    });

    makasih…



Write a Comment

Your email address will not be published. Required fields are marked *


CENTANG untuk bisa mengirimkan komentar. [ Verifikasi bukan robot ]