Rumah >hujung hadapan web >tutorial js >jQuery mengubah suai atribut kelas dan gaya CSS arrangement_jquery

jQuery mengubah suai atribut kelas dan gaya CSS arrangement_jquery

WBOY
WBOYasal
2016-05-16 16:16:401238semak imbas

Pengubahsuaian atribut kelas

Atribut kelas ialah atribut kelas, yang menentukan nama kelas
Apabila menggunakan pemilih kelas untuk menentukan gaya, anda perlu menentukan nama kelas untuk elemen, iaitu, nilai atribut kelas
Ambil perhatian bahawa setiap elemen HTML hanya mempunyai satu atribut kelas Walau bagaimanapun, nilai atribut kelas boleh berbilang nama, iaitu, ia mungkin mengandungi senarai perkataan, dipisahkan dengan ruang
Untuk kaedah penggunaan khusus, lihat: http://www.w3school.com.cn/css/css_selector_class.asp

Untuk mengubah suai nama kelas dengan jQuery, anda boleh menggunakan kaedah attr() untuk mengubah suai atribut "class", atau anda boleh menggunakan addClass(), removeClass(), toggleClass() dan kaedah lain

addClass()

API: http://api.jquery.com/addClass/
Kaedah addClass() menambah nama kelas yang ditentukan (satu atau lebih) pada elemen padanan.
Ambil perhatian bahawa untuk elemen, atribut kelas boleh mempunyai berbilang nilai Kaedah ini tidak mengalih keluar nilai sedia ada, tetapi menambahkan satu atau lebih atribut kelas kepada yang asal Menggunakan kaedah attr() untuk menetapkan atribut kelas ialah proses penggantian manakala addClass() ialah proses penambahan
Kelas akhirnya dipisahkan oleh ruang
Jika anda perlu menambah berbilang kelas, pisahkan nama kelas dengan ruang
Bermula dari 1.4, parameter kaedah ini juga boleh dihantar ke fungsi.

removeClass()

API:

http://api.jquery.com/removeClass/ Kaedah removeClass() mengalih keluar satu atau lebih kelas daripada elemen yang dipilih Jika anda perlu mengalih keluar beberapa kelas, pisahkan nama kelas dengan ruang
Jika tiada parameter diluluskan, kaedah ini akan mengalih keluar semua kelas elemen yang dipilih.

toggleClass()

API:

http://api.jquery.com/toggleClass/ Kaedah toggleClass() menukar (menetapkan atau mengalih keluar) satu atau lebih kelas elemen yang dipilih.
Kaedah ini menyemak kelas yang ditentukan dalam setiap elemen, memadamkannya jika wujud dan menambahnya jika ia tidak wujud
Dengan menambah parameter, anda boleh menetapkan hanya padam atau tambah operasi
Format:$(selector).toggleClass(class,switch)
Apabila nilai suis adalah benar, ia hanya akan ditambahkan apabila ia palsu, ia hanya akan dipadamkan

hasClass()

API:

http://api.jquery.com/hasClass/

Kaedah hasClass() menyemak sama ada elemen yang dipilih mengandungi kelas yang ditentukan. Anda juga boleh menggunakan kaedah is() untuk mencapai fungsi yang sama Parameter kaedah dihantar dalam rentetan pemilih, seperti ".className".


Pengubahsuaian gaya CSS

Terdapat juga beberapa kaedah dalam jQuery yang mengembalikan atau menetapkan sifat CSS elemen


css()


API:

http://api.jquery.com/css/

Operasi baca: Dapatkan nilai gaya yang ditentukan (satu atau lebih) elemen pertama dalam set elemen padanan. Nota: Operasi membaca berbilang nilai gaya hanya ditambahkan dalam jQuery v1.9.
Operasi penulisan: Tetapkan nilai satu atau lebih sifat CSS untuk setiap elemen dalam set elemen padanan.
Parameter yang dihantar boleh menjadi pasangan nilai kunci tunggal, berbilang nilai yang ditentukan oleh PlainObject atau fungsi (v1.4).

jQuery akan mengendalikan beberapa situasi tertentu yang berbeza dalam setiap penyemak imbas Contohnya, cssFloat W3C ialah styleFloat dalam IE Dalam jQuery, anda boleh menggunakan apungan, dan kemudian jQuery akan membantu anda menterjemahkannya ke dalam nama yang betul bagi setiap pelayar .
Juga, jQuery akan mentafsirkan atribut berbilang perkataan dalam format CSS dan DOM, seperti .css ("warna latar belakang") dan .css ("warna latar"), yang boleh diproses


tinggi() dan lebar()

API:

http://api.jquery.com/height/

dan http://api.jquery.com/width/ Atribut ketinggian dan lebar ini tidak termasuk padding, sempadan dan jidar Melainkan atribut saiz kotak digunakan Ambil perhatian bahawa semasa menulis, apa yang ditetapkan ialah lebar dan tinggi kandungan, tidak termasuk bahagian bersaiz kotak Operasi baca masih mengembalikan nilai atribut elemen pertama koleksi.
Perbezaan antara .css("width") dan .width() ialah: yang pertama mengembalikan nilai dengan unit, seperti 400px; yang kedua mengembalikan nilai piksel tanpa unit, iaitu 400.
Jadi jika nilai itu perlu digunakan untuk beberapa pengiraan, .height() dan .width() adalah disyorkan Nilai yang dibaca tidak semestinya integer dan jika pengguna mengezum halaman, nilainya mungkin salah kerana penyemak imbas tidak mendedahkan API untuk situasi ini Terdapat satu lagi ketidaktepatan Apabila elemen induk elemen ini disembunyikan, saiz elemen mungkin tidak dibaca dengan tepat
Jenis nilai yang disokong oleh operasi tulis ialah rentetan atau nombor.
Jika ia adalah nombor, jQuery lalai kepada px sebagai unit
Jika ia adalah rentetan, selain nombor dan unit, sebarang ukuran CSS yang munasabah boleh digunakan, seperti 100%, 50% atau auto.



kedudukan()


API: http://api.jquery.com/position/
Mengembalikan kedudukan elemen padanan pertama berbanding dengan unsur induk (induk mengimbangi).
Hanya baca operasi.

offset()

API: http://api.jquery.com/offset/
Kembalikan koordinat elemen padanan pertama, atau tetapkan koordinat setiap elemen padanan Koordinat ini adalah relatif kepada dokumen

offsetParent()

API: http://api.jquery.com/offsetParent/

Kembali ke kelas induk, hanya baca operasi.

scrollLeft() dan scrollTop()

API:

http://api.jquery.com/scrollLeft/ dan http://api.jquery.com/scrollTop/

Kenyataan:
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