jquery menetapkan atribut kepada elemen

Sebagai perpustakaan JavaScript yang popular, jQuery mempunyai keupayaan untuk mengendalikan elemen DOM dengan mudah dan cekap Atribut tetapan untuk elemen juga merupakan salah satu fungsi biasa. Dalam artikel ini, kami akan meneroka beberapa kaedah tetapan harta yang biasa digunakan dan menggambarkannya dengan contoh khusus.

1. Kaedah tetapan atribut asas

1. Gunakan kaedah attr

Gunakan kaedah attr() untuk menetapkan atribut dan nilai untuk elemen. Contohnya, kod berikut menetapkan atribut <div> kepada nilai id untuk elemen myDiv.

$('div').attr('id', 'myDiv');

Gunakan kaedah attr() untuk menetapkan berbilang atribut dan nilai pada masa yang sama, contohnya:

$('div').attr({
  id: 'myDiv',
  class: 'box'
});

2. Gunakan kaedah prop

prop() kaedah dan attr() Kaedah adalah serupa dan boleh menetapkan sifat dan nilai unsur, tetapi terdapat beberapa perbezaan halus di antara mereka. prop() digunakan terutamanya untuk menetapkan atribut elemen itu sendiri, seperti checked, selected, disabled, dsb., manakala attr() lebih sesuai untuk menetapkan atribut bukan standard elemen. Contohnya, kod berikut menetapkan elemen input kepada keadaan yang dipilih:

$('input[type="checkbox"]').prop('checked', true);

3 Gunakan kaedah data

data() untuk menetapkan atribut data untuk elemen. Sintaksnya sangat mudah, anda hanya perlu lulus atribut untuk ditetapkan dan nilai yang sepadan sebagai parameter. Contohnya, kod berikut menetapkan atribut <div> elemen data-value kepada 100:

$('div').data('value', 100);

4 Gunakan kaedah attr dan data untuk menetapkan atribut tersuai

Gunakan < Kaedah 🎜> dan attr() juga boleh menetapkan sifat tersuai, yang bermula dengan data(). Sebagai contoh, kod berikut menetapkan atribut tersuai data- dan <div> untuk elemen data-count: data-price

$('div').attr('data-count', 10);
$('div').data('price', 100);

2. Cara mendapatkan atribut

Selain menetapkan atribut bagi elemen, anda juga boleh Anda boleh menggunakan jQuery untuk mendapatkan nilai atribut sesuatu elemen. Di sini, kami memperkenalkan tiga kaedah untuk mendapatkan atribut:

1 Gunakan kaedah attr

Gunakan kaedah

untuk mendapatkan nilai atribut unsur. Sebagai contoh, kod berikut memperoleh nilai atribut attr() elemen <div>: id

var idValue = $('div').attr('id');
console.log(idValue); // 输出 'myDiv'

2 Gunakan kaedah prop

Begitu juga, gunakan kaedah

untuk mendapatkan kaedah prop. nilai Atribut elemen, sebagai contoh, kod berikut memperoleh status elemen kotak pilihan yang dipilih: prop()rreee

3 Gunakan kaedah data

Gunakan kaedah

untuk mendapatkan nilai atribut data. daripada elemen, seperti berikut Kod memperoleh nilai atribut data() bagi elemen <div>: data-value

var isChecked = $('input[type="checkbox"]').prop('checked');
console.log(isChecked); // 输出 true 或 false

3. Ringkasan

Artikel ini memperkenalkan cara jQuery menetapkan atribut kepada elemen, termasuk kaedah penetapan atribut asas dan kaedah perolehan Harta biasa. Antaranya, kaedah

sesuai untuk menetapkan atribut bukan standard, kaedah attr() sesuai untuk menetapkan atribut elemen itu sendiri, dan kaedah prop() sesuai untuk menetapkan dan mendapatkan atribut data bagi unsur. Penggunaan kaedah ini secara cekap boleh memudahkan kita memanipulasi elemen DOM dan meningkatkan kecekapan pembangunan. data()

Atas ialah kandungan terperinci jquery menetapkan atribut kepada elemen. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!