contoh jQuery
Contoh jQuery
Adakah anda mahu meningkatkan kemahiran jQuery anda?
Pemilih jQuery
$(this).hide()
Tunjukkan fungsi hide() jQuery untuk menyembunyikan elemen HTML semasa.
$("p").hide()
Menunjukkan fungsi hide() jQuery untuk menyembunyikan semua elemen <p>
$(".test").hide()
Menunjukkan fungsi hide() jQuery untuk menyembunyikan semua elemen dengan class="test".
$("#test").hide()
Menunjukkan fungsi hide() jQuery untuk menyembunyikan elemen dengan id="test".
acara jQuery
jQuery click()
Menunjukkan acara jQuery jQuery click().
jQuery dblclick()
Menunjukkan acara jQuery dblclick().
jQuery mouseenter()
Menunjukkan acara jQuery mouseenter() .
jQuery mouseleave()
Menunjukkan acara jQuery mouseleave() .
jQuery mousedown()
Menunjukkan acara jQuery mousedown() .
jQuery mouseup()
Menunjukkan acara jQuery mouseup() .
jQuery hover()
Menunjukkan acara jQuery hover().
jQuery focus() dan blur()
Menunjukkan acara jQuery focus() dan blur().
Analisis Contoh
jQuery Hide/Show
jQuery hide()
Menunjukkan kaedah jQuery hide().
jQuery hide() dan show()
Menunjukkan kaedah jQuery hide() dan show().
jQuery toggle()
jQuery toggle() digunakan untuk menukar kaedah hide() dan show().
jQuery hide()
Satu lagi contoh menyembunyikan teks.
Analisis contoh
jQuery pudar masuk dan pudar
jQuery fadeIn()
Menunjukkan kaedah jQuery fadeIn().
jQuery fadeOut()
Menunjukkan kaedah jQuery fadeOut().
jQuery fadeToggle()
Menunjukkan kaedah jQuery fadeToggle() .
jQuery fadeTo()
Menunjukkan kaedah jQuery fadeTo() .
Contoh analisis
jQuery gelongsor
jQuery slideDown()
Menunjukkan kaedah jQuery slideDown().
jQuery slideUp()
Menunjukkan kaedah jQuery slideUp().
jQuery slideToggle()
Menunjukkan kaedah jQuery slideToggle().
Contoh analisis
animasi jQuery
jQuery animate()
Menunjukkan kaedah jQuery animate() yang mudah.
jQuery animate() - Tetapkan berbilang sifat css
Menunjukkan perubahan gaya melalui kaedah jQuery animate().
jQuery animate() - Menggunakan nilai korelasi
Menunjukkan cara menggunakan nilai korelasi dalam kaedah jQuery animate().
jQuery animate() - Menggunakan nilai pratakrif
Menunjukkan nilai "hide", "show", "togol" yang dipratakrif melalui kaedah animate().
jQuery animate()
Menunjukkan lebih banyak contoh kaedah jQuery animate()
jQuery animate()
Menunjukkan lebih banyak contoh kaedah jQuery animate() (pelbagai animate() panggil balik).
Penghuraian instance
animasi hentian jQuery
slaid jQuery stop()
kaedah hentian jQuery( ) demo.
animasi jQuery stop() (dengan parameter)
Menunjukkan kaedah jQuery stop() .
Analisis contoh
pemerolehan dan atribut jQuery HTML
jQuery text() dan html() - Dapatkan teks dan kandungan
Gunakan kaedah jQuery text() dan html() untuk mendapatkan kandungan.
jQuery val() - Dapatkan nilai
Gunakan kaedah jQuery val() untuk mendapatkan nilai medan borang.
jQuery attr() - Dapatkan nilai atribut
Gunakan kaedah jQuery attr() untuk mendapatkan nilai atribut.
Analisis contoh
kandungan dan atribut tetapan HTML jQuery
jQuery text(), html(), dan val() - Tetapkan kandungan
Gunakan kaedah jQuery text(), html() dan val() untuk menetapkan kandungan.
jQuery text() dan html() - Tetapkan kandungan dan gunakan fungsi panggil balik
Gunakan text() dan html() untuk menetapkan kandungan dan gunakan fungsi panggil balik
jQuery attr() - Tetapkan nilai Atribut
Gunakan kaedah jQuery attr() untuk menetapkan nilai atribut.
jQuery attr() - Tetapkan berbilang nilai atribut
Gunakan kaedah jQuery attr() untuk menetapkan berbilang nilai atribut.
jQuery attr() - Tetapkan nilai atribut dan gunakan fungsi panggil balik
Tetapkan nilai atribut + dan gunakan fungsi panggil balik untuk memanggil attr().
Penghuraian contoh
jQuery HTML menambah elemen/kandungan
jQuery add()
pada elemen yang dipilih Tambah kandungan pada penghujung elemen yang dipilih
jQuery prepend()
Tambah kandungan pada permulaan elemen yang dipilih
jQuery append() - Masukkan berbilang elemen
Inovasi elemen teks/HTML baharu, jQuery dan JavaScript/DOM. Dilampirkan selepas teks elemen baharu.
jQuery selepas() dan sebelum()
Tambahkan elemen HTML sebelum dan selepas elemen yang dipilih.
jQuery after() - Masukkan berbilang elemen
Inovasi elemen teks/HTML baharu, jQuery dan JavaScript/DOM. Memasukkan elemen baharu pada penghujung elemen yang dipilih.
Contoh analisis
jQuery HTML alih keluar elemen/kandungan
jQuery remove()
Alih keluar elemen yang dipilih
jQuery empty()
Alih keluar semua elemen anak bagi elemen yang dipilih
jQuery remove() - Penapis elemen menggunakan parameter
dan alih keluar
penghuraian contoh
jQuery Dapatkan dan tetapkan kelas CSS
jQuery addClass()
Tambahkan atribut kelas kepada elemen yang berbeza
jQuery addClass() - berbilang kelas
Gunakan kaedah addClass() untuk menambah berbilang kelas
jQuery removeClass()
Alih keluar elemen yang ditentukan Kelas
jQuery toggleClass()
Togol (tambah/padam) kelas dalam elemen yang dipilih
Analisis instance
kaedah jQuery css()
jQuery css() - Mengembalikan sifat CSS
Mengembalikan css bagi unsur padanan pertama Harta value
jQuery css() - Tetapkan sifat CSS
Tetapkan sifat CSS yang ditentukan oleh semua elemen konfigurasi
jQuery css() - Tetapkan sifat CSS
Tetapkan nilai padanan berbilang elemen CSS Property
Instance Parsing
Saiz jQuery
jQuery - Mengembalikan width() dan height()
Mengembalikan lebar dan tinggi elemen yang ditentukan
jQuery - Mengembalikan innerWidth() dan innerHeight()
Mengembalikan inner- lebar elemen /height yang ditentukan
jQuery - Mengembalikan outerWidth() dan outerHeight()
Mengembalikan lebar luar elemen/tinggi yang ditentukan
jQuery - Mengembalikan outerWidth(true) dan outerHeight(true)
Mengembalikan lebar luar/tinggi elemen yang ditentukan (termasuk sempadan luar)
jQuery - mengembalikan lebar() dan tinggi() dokumen dan tetingkap
Mengembalikan lebar dan tinggi dokumen HTML dan tetingkap
jQuery - Tetapkan lebar() dan tinggi()
Tetapkan lebar dan tinggi elemen yang ditentukan
Analisis contoh
jQuery Traversal - Ancestors
jQuery parent()
Menunjukkan jQuery kaedah induk().
jQuery parents()
Menunjukkan kaedah jQuery parents().
jQuery parentsUntil()
Menunjukkan kaedah jQuery parentsUntil().
Contoh analisis
jQuery Traversal - Descendants
jQuery children()
Menunjukkan kaedah jQuery children() .
jQuery find()
Menunjukkan kaedah jQuery find().
Analisis Contoh
jQuery Traversal - Adik Beradik
jQuery siblings()
Menunjukkan kaedah jQuery siblings().
jQuery next()
Menunjukkan kaedah jQuery next() .
jQuery nextAll()
Menunjukkan kaedah jQuery nextAll() .
jQuery nextUntil()
Menunjukkan kaedah jQuery nextUntil().
Contoh analisis
kaedah jQuery AJAX load()
jQuery load()
Secara tak segerak memuatkan kandungan fail dan memasukkannya ke dalam elemen <div>
jQuery load()
Secara tak segerak memuatkan kandungan elemen yang dinyatakan dalam kandungan fail dan memasukkannya ke dalam elemen <div>.
jQuery load() - Gunakan fungsi panggil balik (panggilan balik)
Gunakan fungsi panggil balik kaedah jQuery load().
Contoh analisis
kaedah jQuery AJAX get() dan post()
jQuery get()
Gunakan kaedah $.get() untuk mendapatkan data secara tidak segerak daripada pelayan
jQuery post()
Gunakan $.post() kaedah Dapatkan data daripada pelayan secara tidak segerak
Analisis contoh
