Elementa teksta maiņa ar jQuery
Iepriekšējās nodarbībās mēs iemācījāmies iegūt
elementu grupu ar jQuery un pat redzējām
dažus darbības ar metodēm piemērus. Tagad
apskatīsim tās sīkāk. Šajā nodarbībā
mēs iemācīsimies mainīt elementa tekstu, izmantojot divas
metodes: html un
text.
Atrisināsim šādu uzdevumu: iegūsim visus elementus
ar klasi www un vienlaikus mainīsim
visiem tiem tekstu uz '!!!'. Pieņemsim, ka mums ir
šāds HTML kods:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
Tad JavaScript kods izskatīsies šādi:
let elems = document.getElementsByClassName('www');
for (let i = 0; i < elems.length; i++) {
elems[i].innerHTML = '!!!';
}
Ar jQuery viss būs daudz vienkāršāk: iegūsim
visus elementus, izmantojot dolāra zīmi, šādi:
$('.www'), un tad uz tiem piemērosim metodi
html,
kas parametru pieņem jauno
tekstu - $('.www').html('new text'). Tas viss! Šī
rindiņa veiks visu darbu bez jebkādiem cikliem un
citas nevajadzīgas lietas. Palaidiet piemēru un pārliecinieties
par to paši:
$('.www').html('!!!');
Visiem h3 ar metodes html palīdzību
iestatiet tekstu '!!!'.