jQuery $.data() vs. $.attr(): Bilakah Anda Harus Menggunakan Setiap?

Data jQuery vs Attr: Memahami Perbezaan

Apabila bekerja dengan elemen DOM, jQuery menyediakan dua kaedah untuk mengakses dan memanipulasi atribut data: $ .data dan $.attr. Walaupun kedua-duanya boleh digunakan untuk menambah, mendapatkan dan mengalih keluar atribut data, ia mempunyai perbezaan utama dalam tujuan dan fungsi.

$.data

$.data terutamanya berinteraksi dengan cache dalaman yang dikekalkan oleh jQuery. Cache ini digunakan untuk menyimpan data arbitrari yang dikaitkan dengan elemen DOM dan ia bukan sebahagian daripada DOM HTML itu sendiri.

Jika anda perlu menyimpan data yang bukan sebahagian daripada penanda HTML dan ingin mengaksesnya kemudian , $.data ialah pendekatan yang disyorkan. Contohnya, anda boleh menggunakannya untuk menyimpan maklumat keadaan atau pilihan pengguna yang tidak perlu dipaparkan pada halaman.

$.attr

$.attr, sebaliknya, berfungsi dengan HTML DOM secara langsung. Ia membolehkan anda mengakses dan mengubah suai atribut data HTML5 yang ditambahkan pada elemen DOM. Atribut ini disimpan dalam elemen itu sendiri sebagai rentetan dan boleh diakses menggunakan sintaks "data-attribute-name".

Jika anda ingin bekerja dengan atribut data yang merupakan sebahagian daripada penanda HTML dan ingin memastikan keserasian dengan pelayar atau rangka kerja lain, $.attr ialah pilihan pilihan. Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa $.attr hanya boleh menyimpan nilai rentetan, manakala $.data boleh menyimpan objek kompleks.

Penghantaran Automatik dalam $.data

Satu kelebihan penting $.data ialah ciri penghantaran automatiknya. Ia secara automatik menukar nilai rentetan yang sepadan dengan corak tertentu ke dalam primitif JavaScript, seperti rentetan, nombor, boolean dan JSON. Ini boleh menjadi mudah apabila mendapatkan semula data daripada penanda HTML atau membuat instantiat widget.

Nama Atribut Bersempang

Apabila bekerja dengan nama atribut bersempang, ingat bahawa $.data auto-tukar mereka ke camelCase. Walau bagaimanapun, borang sempang masih berfungsi untuk mengakses data, dan versi camelCase tersedia dalam objek yang dikembalikan oleh $.data. Secara amnya disyorkan untuk menggunakan bentuk atribut data huruf kecil dan tidak bersempang untuk ketekalan.

Bila Menggunakan Setiap Kaedah

Sebagai peraturan umum, gunakan $.data apabila anda perlu menyimpan data tersuai pada elemen DOM yang bukan sebahagian daripada penanda HTML. $.attr harus digunakan apabila anda perlu mengakses atau mengubah suai atribut data yang merupakan sebahagian daripada penanda HTML atau apabila anda secara khusus perlu menyimpan nilai rentetan.

Dengan memahami perbezaan antara $.data dan $.attr , anda boleh mengurus dan menggunakan atribut data dengan berkesan dalam aplikasi jQuery anda.

Atas ialah kandungan terperinci jQuery $.data() vs. $.attr(): Bilakah Anda Harus Menggunakan Setiap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!