Rumah > Artikel > hujung hadapan web > Bagaimana untuk menetapkan atribut kepada elemen dalam jquery
Bagaimana untuk menetapkan atribut kepada elemen dalam jquery
- 青灯夜游asal
- 2022-03-10 18:42:117020semak imbas
Kaedah tetapan: 1. Gunakan kaedah attr(), sintaks "$(selector).attr(nama atribut, nilai)" atau "$(selector).attr({nama atribut: nilai;})" ;2. Gunakan kaedah prop(), sintaksnya ialah "$(selector).prop(property name, value)".
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 1.10.2, komputer Dell G3.
jquery menetapkan atribut untuk elemen
1. Gunakan kaedah attr()
attr ( ) kaedah menetapkan atau mengembalikan nilai atribut bagi elemen yang dipilih. Bergantung pada parameter kaedah, cara ia berfungsi juga berbeza.
Sintaks:
//单个属性
$(selector).attr(属性名,值)
//多个属性
$(selector).attr({属性名:值;属性值:值...})2 Gunakan kaedah prop()
kaedah prop() untuk menetapkan atau mengembalikan atribut dan nilai daripada elemen yang dipilih.
Apabila kaedah ini digunakan untuk menetapkan nilai atribut, satu atau lebih pasangan atribut/nilai ditetapkan untuk set elemen padanan.
Sintaks:
//单个属性
$(selector).prop(属性名,值)
//多个属性
$(selector).prop({属性名:值;属性值:值...})3 Perbezaan antara kaedah attr() dan prop()
kaedah prop() dan attr() kaedah Sama, kedua-duanya digunakan untuk mendapatkan atau menetapkan atribut HTML elemen, tetapi terdapat perbezaan penting antara keduanya.
Syor rasmi jQuery: Untuk atribut dengan dua nilai true dan false, seperti ditandai, dipilih dan dilumpuhkan, adalah disyorkan untuk menggunakan kaedah prop() untuk beroperasi, manakala untuk atribut lain adalah disyorkan untuk menggunakan kaedah attr() untuk beroperasi.
Contoh:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(function () {
$('input[type="radio"]').change(function(){
var bool = $(this).attr("checked");
if(bool){
$("p").text("你选择的是：" + $(this).val());
}
})
})
</script>
</head>
<body>
<div>
<label><input type="radio" name="fruit" value="苹果" />苹果</label>
<label><input type="radio" name="fruit" value="香蕉" />香蕉</label>
<label><input type="radio" name="fruit" value="西瓜" />西瓜</label>
</div>
<p></p>
</body>
</html>Kesan pratonton ditunjukkan dalam Rajah 1.
Analisis
$().change(function(){
……
})Di atas mewakili peristiwa perubahan dalam jQuery, yang sama dengan peristiwa onchange dalam JavaScript detail nanti.
Dalam contoh ini, kami sebenarnya mahu menggunakan $(this).attr("checked") untuk menentukan sama ada butang radio dipilih Jika ia dipilih, dapatkan nilai butang radio. Tetapi selepas menjalankan kod, saya dapati: Ia tidak mempunyai kesan sama sekali! kenapa ni?
Malah, untuk atribut yang diperiksa, dipilih dan dilumpuhkan bagi elemen borang, kami tidak boleh mendapatkannya menggunakan kaedah attr(), tetapi mesti menggunakan kaedah prop(). Oleh itu, ia akan berfungsi jika kita menggantikan kaedah attr() dengan kaedah prop().
Malah, kaedah prop() nampaknya mengimbangi kelemahan kaedah attr() dalam operasi atribut bentuk. Ingat satu ayat: Jika harta tidak boleh diperoleh atau ditetapkan menggunakan kaedah attr(), ia boleh dicapai dengan menukar kaedah prop().
[Pembelajaran yang disyorkan: tutorial video jQuery, video bahagian hadapan web]
Atas ialah kandungan terperinci Bagaimana untuk menetapkan atribut kepada elemen dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!