Mana yang lebih baik saya lakukan? .hide()
lebih cepat daripada menulis .css("display", "none")
, tetapi apa bedanya dan apa yang sebenarnya mereka berdua lakukan terhadap elemen HTML?
153
Dari halaman jQuery tentang .hide () :
"Elemen yang cocok akan segera disembunyikan, tanpa animasi. Ini kira-kira setara dengan memanggil .css ('display', 'none'), kecuali bahwa nilai properti tampilan disimpan dalam cache data jQuery sehingga tampilan nanti dapat dikembalikan ke nilai awalnya. Jika suatu elemen memiliki nilai tampilan inline, kemudian disembunyikan dan ditampilkan, itu sekali lagi akan ditampilkan inline. "
Jadi, jika penting Anda dapat kembali ke nilai sebelumnya display
, sebaiknya gunakan hide()
karena keadaan sebelumnya diingat. Selain itu tidak ada perbedaan.
.hide()
menyimpan properti sebelumnyadisplay
sesaat sebelum menyetelnyanone
, jadi jika itu bukandisplay
properti standar untuk elemen yang Anda sedikit lebih aman,.show()
akan menggunakan properti yang disimpan itu untuk kembali. Jadi ... itu memang bekerja ekstra, tetapi kecuali Anda melakukan banyak elemen, perbedaan kecepatan harus diabaikan.sumber
Melihat kode jQuery, inilah yang terjadi:
sumber
Mereka adalah hal yang sama.
.hide()
memanggil fungsi jQuery dan memungkinkan Anda untuk menambahkan fungsi callback ke dalamnya. Jadi, dengan.hide()
Anda dapat menambahkan animasi misalnya..css("display","none")
mengubah atribut elemen menjadidisplay:none
. Sama seperti jika Anda melakukan hal berikut dalam JavaScript:The
.hide()
Fungsi jelas membutuhkan lebih banyak waktu untuk menjalankan karena pemeriksaan untuk fungsi callback, kecepatan, dll ...sumber
Menggunakan keduanya adalah jawaban yang bagus; itu bukan pertanyaan tentang salah satu atau.
The Keuntungan dari menggunakan kedua adalah bahwa CSS akan segera menyembunyikan elemen ketika beban halaman. JQuery .hide akan mem-flash elemen selama seperempat detik kemudian menyembunyikannya.
Dalam kasus ketika kita ingin agar elemen tidak ditampilkan ketika halaman dimuat, kita dapat menggunakan CSS dan mengatur tampilan: tidak ada & menggunakan jQuery .hide (). Jika kita berencana untuk beralih elemen kita dapat menggunakan jQuery toggle.
sumber
Keduanya melakukan hal yang sama pada semua browser, AFAIK. Diperiksa pada Chrome dan Firefox, baik append
display:none
kestyle
atribut elemen.sumber
Lihat tidak ada perbedaan jika Anda menggunakan metode hide dasar. Tapi jquery menyediakan berbagai metode sembunyikan yang memberi efek pada elemen. Lihat tautan di bawah ini untuk penjelasan terperinci: Efek untuk Sembunyikan di Jquery
sumber