Kufanya Kazi na Njia ya each katika jQuery

Wakati tuna kundi la vipengee vilivyopatikana kwa kutumia jQuery, tunaweza kufanya mabadiliko ndani yao kwa vipengee vyote kwa wakati mmoja.

Kwa mfano, ikiwa tunataka kubadilisha maandishi ya aya zote zilizopatikana - hatuwezi kufanya kuwa tofauti.

Katika kesi hii, njia maalum each itatusaidia, ambayo inaruhusu kutumia kiwango chochote cha kazi kwa vipengee vyote vya seti jQuery. Wakati huo huo, ndani ya kiwango hiki cha kazi tutaweza kugawanya vipengee na kuchukua hatua tofauti kwa kila mmoja wao.

Kimsingi each ni kitanzi, ambacho kwa msaada wake unaweza kupitia vipengee vyote vilivyopatikana. Kiungo kwa kipengele ambacho kitanzi kinapita sasa kitakuwa kwenye this.

Tunaweza kutumia tu this hii kwenye JavaScript safi, kama tulivyofanya awali, kwa mfano, hivi - this.innerHTML - na kutoa yaliyomo ndani ya vipengee vyetu. Lakini ni bora kuifunga this kwenye dola jQuery kwa njia hii - $(this) - katika kesi hii tutaweza kutumia kwake njia zote na minyororo ya jQuery.

Wacha tuzingatie msimbo ufuatao wa HTML:

<p class="www">maandishi</p>
<p class="www">maandishi</p>
<p class="www">maandishi</p>
<p>maandishi</p>

Katika mfano huu, tunapaswa kupata vipengee vyote na darasa www na kuonyesha kwenye skrini yaliyomo ndani yao. Jinsi inavyofanyika: kwa kutumia $('.www') tunapata vipengee tunavyohitaji, kisha kwa kutumia each(test) tunatumia kiwango cha kazi test kwa kila kipengee kilichopatikana. Kwanza itatumika kwa aya ya kwanza, kisha kwa ya pili, ya tatu na kadhalika.

Ndani ya kiwango cha kazi this itaonyesha kipengele ambacho kiwango cha kazi kinatumika test - kwanza hii itakuwa kipengele cha kwanza, kisha cha pili, na kadhalika. Kwa kutumia muundo kama huu $(this) badala ya kawaida this kutoka JavaScript tutapata kipengele cha jQuery na tutatumia kwake njia html, ambayo itapata maandishi ya kipengele chetu. Na, kisha yataonyeshwa tu kwenye skrini:

/*
	Tunaita kiwango cha kazi test bila alama ya kunukuu na (),
	kwa sababu tunahitaji msimbo wake, na sio matokeo:
*/

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

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

Ili kutatua kazi hii, kiwango cha kazi kisichojulikana kinaweza pia kutumiwa - hii hufanyika mara nyingi zaidi:

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

Tunaweza pia kufikisha kwa njia each kiwango cha kazi cha callback chenye vigezo.

Wacha katika mfano ufuatao tuongeze mwishoni kwa li zote kwenye ukurasa nambari yao ya mlolongo. Sasa kwenye kiwango chetu cha kazi kisichojulikana tutafikisha nambari ya kipengele na kipengele chenyewe:

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

Na sasa badala ya elem tutumie this:

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

Badilisha yaliyomo ya li zote kuwa nambari yao ya mlolongo.