Bagaimana untuk membuat elemen kelihatan dalam jquery

WBOY
Lepaskan: 2023-05-12 10:15:37
asal
1144 orang telah melayarinya

Dengan populariti halaman Web, teknologi bahagian hadapan sentiasa dikemas kini dan dipertingkatkan. Antaranya, jQuery, sebagai rangka kerja front-end yang agak matang, telah menjadi salah satu alat pilihan untuk sebilangan besar pembangun front-end. Dalam pembangunan harian, menentukan sama ada elemen boleh dilihat ialah keperluan biasa Mari kita perkenalkan cara jQuery menentukan sama ada elemen boleh dilihat.

1 Kaedah untuk menentukan sama ada sesuatu elemen boleh dilihat

Dalam jQuery, terdapat banyak cara untuk menentukan sama ada sesuatu elemen boleh dilihat. Kaedah yang paling biasa ialah menggunakan kaedah css() untuk mendapatkan nilai atribut paparan. Kod pelaksanaan khusus adalah seperti berikut:

if ($(selector).css('display') == 'none') {
    //元素不可见的处理代码
} else {
    //元素可见的处理代码
}
Salin selepas log masuk

Kaedah ini hanya sesuai untuk menentukan sama ada nilai atribut paparan elemen adalah tiada. Memandangkan terdapat banyak cara untuk menyembunyikan unsur, seperti kelegapan, keterlihatan, dsb., kaedah ini tidak tepat sepenuhnya dan mungkin menyebabkan salah penilaian dalam sesetengah kes. Oleh itu, kita perlu menggunakan kaedah yang lebih tepat untuk menentukan sama ada sesuatu elemen boleh dilihat.

2 Gunakan kaedah is() untuk menentukan sama ada sesuatu elemen boleh dilihat

jQuery menyediakan kaedah yang lebih tepat untuk menentukan sama ada sesuatu elemen boleh dilihat, iaitu, gunakan kaedah is() . Kaedah is() boleh digunakan untuk menyemak sama ada elemen semasa sepadan dengan pemilih yang diberikan, dan boleh dipadankan dengan beberapa atribut elemen (seperti: boleh dilihat) untuk menentukan sama ada elemen itu boleh dilihat. Kod pelaksanaan khusus adalah seperti berikut:

if ($(selector).is(':visible')) {
    //元素可见的处理代码
} else {
    //元素不可见的处理代码
}
Salin selepas log masuk

Dalam kod di atas, pemilih :visible digunakan untuk menyemak sama ada elemen kelihatan. Jika benar dikembalikan, elemen itu kelihatan; jika salah dikembalikan, elemen itu tidak kelihatan. Ambil perhatian bahawa kaedah ini hanya berfungsi untuk sifat CSS yang ditakrifkan dalam gaya sebaris atau helaian gaya terbenam Jika keterlihatan elemen ditakrifkan dalam fail CSS luaran, salah penilaian mungkin berlaku.

3 Gunakan atribut offsetHeight dan offsetWidth untuk menentukan sama ada elemen boleh dilihat

Selain kaedah di atas, anda juga boleh menggunakan atribut offsetHeight dan offsetWidth bagi elemen untuk menentukan sama ada unsur kelihatan. Dalam keadaan biasa, jika sifat offsetHeight dan offsetWidth bagi sesuatu elemen adalah sama dengan 0, elemen itu tidak kelihatan. Kod pelaksanaan khusus adalah seperti berikut:

if ($(selector)[0].offsetHeight > 0 && $(selector)[0].offsetWidth > 0) {
    //元素可见的处理代码
} else {
    //元素不可见的处理代码
}
Salin selepas log masuk

Dalam kaedah ini, [0] mewakili elemen pertama yang dipadankan oleh pemilih. Jika elemen tidak kosong, anda boleh menggunakan sifat offsetHeight dan offsetWidth untuk menentukan sama ada elemen itu boleh dilihat. Jika elemen kelihatan, kedua-dua sifat offsetHeight dan offsetWidth elemen hendaklah lebih besar daripada 0.

4. Ringkasan

jQuery menyediakan berbilang kaedah untuk menentukan sama ada sesuatu elemen boleh dipilih bergantung pada keperluan tertentu. Jika anda hanya perlu menentukan sama ada elemen dipaparkan atau tidak, anda boleh menggunakan kaedah css() untuk mendapatkan nilai atribut paparan. Jika anda perlu menentukan sama ada elemen kelihatan, anda boleh menggunakan kaedah is() atau sifat offsetHeight dan offsetWidth. Mana-mana kaedah memerlukan perhatian kepada beberapa butiran untuk memastikan hasil yang betul.

Atas ialah kandungan terperinci Bagaimana untuk membuat elemen kelihatan dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!