Metod attr

Metod attr elementning istalgan atributini olish va o'zgartirish imkonini beradi.

Elementlarning xususiyatlari va atributlarini aralashtirib yubormaslik muhimdir. DOM daraxti yaratilganda, atributlar mos keladigan DOM elementlarining xususiyatlariga aylantiriladi. Ularning nomi har doim ham mos kelmasligi mumkin, xuddi ularning qiymatlari kabi. Ba'zi xususiyatlar ham mos keladigan atributlarga ega bo'lmasligi mumkin, ular faqat prop metodi yordamida olinishi va o'rnatilishi mumkin, masalan tagName xususiyati.

Sintaksis

Atribut qiymatini olish:

$(selektor).attr(atribut nomi);

Atribut qiymatini o'zgartirish:

$(selektor).attr(atribut nomi, yangi qiymat);

Bir nechta atributlarning qiymatlarini o'zgartirish:

$(selektor).attr({birinci_atribut: yangi_qiymat, ikkinchi_atribut: yangi_qiymat, ...});

Funksiyani to'plamdagi har bir elementga qo'llash:

$(selektor).attr(atribut nomi, function(to'plamdagi tartib raqami, atributning joriy qiymati));

Misol

Quyidagi misolda biz inputni uning id orqali topamiz va uning value atributi qiymatini ekranga chiqaramiz:

<input type="text" value="!!!" id="test">

let value = $('#test').attr('value');
console.log(value);

Misol

Endi esa 'www' yangi qiymatini shu atributga yozamiz:

<input type="text" value="!!!" id="test"> $('#test').attr('value', 'www');

HTML kodi quyidagicha ko'rinadi:

<input type="text" value="www" id="test">

Misol

Keling, bir vaqtning o'zida type va value atributlarini o'zgartiramiz:

<input type="text" value="!!!" id="test"> $('#test').attr({value: 'www', type: 'password'});

HTML kodi quyidagicha ko'rinadi:

<input type="password" value="www" id="test">

Misol

Keling, har bir inputning value atributini o'zgartiramiz - joriy value ga elementning to'plamdagi tartib raqamini qo'shamiz:

<input type="text" value="aaa">
<input type="text" value="bbb">
<input type="text" value="ccc">

$('input').attr('value', function(index, value) {
	return value + ' ' + index;
});

HTML kodi quyidagicha ko'rinadi:

<input type="text" value="aaa 0">
<input type="text" value="bbb 1">
<input type="text" value="ccc 2">

Shuningdek qarang

metod removeAttr,
bu elementlarning atributlarini o'chirish imkonini beradi
metod prop,
bu elementlarning xususiyatlari bilan ishlash imkonini beradi
metod val,
bu elementning joriy qiymatini olish va o'zgartirish imkonini beradi