Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk menggunakan pertanyaan atribut dalam jquery

Bagaimana untuk menggunakan pertanyaan atribut dalam jquery

WBOY
WBOYasal
2023-05-28 10:25:07705semak imbas

jQuery ialah perpustakaan JavaScript yang digunakan secara meluas untuk memanipulasi HTML dan CSS DOM dan menyediakan banyak fungsi berguna. Satu ciri sedemikian ialah menggunakan pertanyaan atribut untuk mendapatkan atau menetapkan nilai atribut sesuatu elemen.

Pertanyaan atribut ialah pemilih yang menerima nama atribut dan nilai atribut pilihan sebagai parameter Ia akan mengembalikan semua elemen dengan atribut yang ditentukan. Berikut ialah contoh mudah yang menunjukkan cara menggunakan pemilih atribut jQuery:

// 获取所有带有'data-role'属性的div元素
var divs = $('div[data-role]');

// 获取所有标签名为'a', 并且target属性值等于'_blank'的a元素
var links = $('a[target="_blank"]');

Dalam dua contoh di atas, fungsi $() digunakan untuk mencipta objek jQuery, dan parameter yang diluluskan ialah pemilih CSS. Antara pemilih CSS ini, pemilih atribut ditakrifkan menggunakan kurungan segi empat sama. Sebagai contoh, [data-role] memadankan semua elemen dengan atribut 'data-role', manakala [target="_blank"] hanya akan memadankan elemen dengan nilai atribut sasaran yang sama dengan '_blank'.

Anda boleh menggunakan pengendali dan nilai berikut untuk melaksanakan pertanyaan atribut:

  • =: Padankan elemen dengan nilai atribut yang dinyatakan sama. Contohnya, [target="_blank"] mewakili elemen yang nilai atribut sasarannya ialah '_blank'.
  • !=: Memadankan elemen yang nilainya tidak sama dengan atribut yang ditentukan. Sebagai contoh, [type!="text"] bermaksud semua elemen kecuali kotak input jenis 'teks'.
  • ^=: Memadankan elemen yang nilai atributnya ditentukan bermula dengan nilai yang diberikan. Sebagai contoh, [href^="https://"] akan memadankan semua hiperpautan bermula dengan 'https://'.
  • $=: Memadankan elemen yang nilai atributnya ditentukan berakhir dengan nilai yang diberikan. Contohnya, [href$=".pdf"] akan memadankan pautan ke semua fail PDF.
  • *=: Memadankan elemen yang nilai atributnya ditetapkan mengandungi rentetan yang diberikan. Sebagai contoh, [class*="active"] akan memadankan semua elemen dengan kelas 'aktif'.

Selain menggunakan pemilih atribut, anda juga boleh menggunakan kaedah .attr() untuk mendapatkan atau menetapkan nilai atribut elemen. Kaedah ini menerima nama sifat dan nilai sifat baharu pilihan sebagai parameter. Jika tiada nilai hartanah baharu dinyatakan, nilai hartanah semasa dikembalikan.

Berikut ialah contoh yang menunjukkan cara menggunakan kaedah .attr() untuk mendapatkan dan menetapkan nilai atribut sesuatu elemen:

// 获取第一个图片元素的alt属性值
var altText = $('img:first').attr('alt');

// 设置第一个图片元素的alt属性值为'图片描述'
$('img:first').attr('alt', '图片描述');

Dalam contoh ini, kaedah attr() ialah digunakan untuk mendapatkan atau menetapkan atribut alt yang pertama bagi elemen imej. Mula-mula, kami memilih elemen imej pertama menggunakan pemilih $('img:first'). Kemudian, gunakan kaedah .attr('alt') untuk mendapatkan nilai atribut altnya dan simpan dalam pembolehubah altText. Seterusnya, kami menghantar nilai atribut baharu 'penerangan imej' kepada kaedah .attr() untuk menetapkan nilai atribut alt baharu.

Ringkasnya, pertanyaan atribut ialah salah satu pemilih yang paling biasa digunakan dalam jQuery dan digunakan untuk memilih elemen dengan nilai atribut tertentu. Selain itu, kaedah .attr() juga boleh digunakan untuk mendapatkan atau menetapkan nilai atribut sesuatu elemen. Fungsi ini sangat praktikal dan boleh memudahkan operasi dokumen, menjadikan pengaturcaraan JavaScript lebih mudah dan lebih mudah.

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

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