Работа бо усули each дар jQuery

Вақте ки мо як гурӯҳи элементҳо дорем, ки бо ёрии jQuery гирифта шудаанд, мо метавонем танҳо барои ҳамаи элементҳо якбора дар онҳо тағйирот ворид кунем.

Масалан, агар мо мехоҳем матни ҳамаи параграфҳои ёфташударо иваз кунем - мо наметавонем онро гуногун созем.

Дар ин ҳолат ба мо усули махсус each кӯмак мекунад, ки имкон медиҳад ягон функсияро барои ҳамаи элементҳои маҷмӯи jQuery истифода барем. Дар ин вақт дар дохили ин функсия мо метавонем элементҳоро ҷудо кунем ва ба ҳар яке аз онҳо гуногун рафтор кунем.

Дар асл each як ҳалқа аст, ки бо ёрии он метавон ҳамаи элементҳои ёфташударо такрор кард. Истинод ба он элементе, ки ҳалқа ҳоло тавассути он мегузарад, дар this хоҳад буд.

Мо метавонем танҳо аз ин this дар JavaScript-и холӣ истифода барем, тавре ки мо пештар мекардем, масалан, чунин - this.innerHTML - ва мундариҷаи дохилии элементҳои худро барорем. Аммо беҳтар аст, ки thisро ба доллари jQuery чунин даруғанд кунем - $(this) - дар ин ҳолат мо метавонем ба он ҳамаи усулҳо ва занҷирҳои jQuery-ро истифода барем.

Биёед рамзи HTML-и зеринро дида бароем:

<p class="www">матн</p>
<p class="www">матн</p>
<p class="www">матн</p>
<p>матн</p>

Дар ин мисол мо бояд ҳамаи элементҳо бо синфи wwwро гирифта ва мундариҷаи онҳоро ба экран барорем. Чӣ тавр анҷом дода мешавад: бо ёрии $('.www') мо элементҳои зарурии худро мегирем, сипас бо ёрии each(test) мо ба ҳар як элементи гирифташуда функсияи test-ро мезанем. Он аввал ба параграфи якум меафтад, пас ба дуввум, ба сеюм ва ҳамин тавр.

Дар дохили функсия this ба он элементи ишора мекунад, ки ба он функсия test меафтад - аввал ин элемент якум хоҳад буд, пас дуввум, ну ва ҳамин тавр. Бо ёрии чунин сохтор $(this) мо ба ҷои оддии this аз JavaScript як элементи jQuery мегирем ва ба он усули html-ро мезанем, ки матни элементи моро мегирад. Ну, ва баъд он танҳо ба экран бароварда мешавад:

/*
	Номи функсияи test бе қошишҳо ва (),
	зеро мо ба рамзи он ниёз дорем, на натиҷа:
*/

$('.www').each(test);

function test() {
	alert($(this).html());
}

Барои ҳалли ин вазифа метавон функсияҳои номаълумро низ истифода бурд - инро аксаран мекунанд:

$('.www').each(function() {
	alert($(this).html());
});

Инчунин мо метавонем ба усули each callback-функсияро бо параметрҳо гузаронем.

Биёед дар мисоли оянда ба охир ҳамаи li дар саҳифа рақами тартибии онҳоро илова кунем. Ҳоло ба функсияи номаълуми мо мо рақами элемент ва худи элементро мегузаронем:

$('li').each(function (index, elem) {
	$(elem).append(index);
});

Ҳоло ба ҷои elem истифода бурда thisро истифода барем:

$('li').each(function (index) {
	$(this).append(index);
});

Мундариҷаи ҳамаи liро ба рақами тартибии онҳо иваз кунед.