Ændring af elementtekst via jQuery

I de foregående lektioner lærte vi at hente en gruppe elementer via jQuery og så endda nogle eksempler på arbejde med metoder. Nu vil vi se nærmere på dem. I denne lektion vil vi lære at ændre tekst på et element ved hjælp af to metoder: html og text.

Lad os løse følgende opgave: hent alle elementer med klassen www og samtidig ændre teksten for dem alle til '!!!'. Lad os sige, at vi har følgende HTML-kode:

html<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>

Så vil JavaScript-koden se sådan ud:

javascriptlet elems = document.getElementsByClassName('www');

for (let i = 0; i < elems.length; i++) {
  elems[i].innerHTML = '!!!';
}

Med jQuery er det meget nemmere: vi henter alle elementer med dollar-tegnet, sådan her: $('.www'), og derefter anvender vi metoden html på dem, som accepterer den nye tekst som parameter - $('.www').html('new text'). Det er alt! Denne linje udfører alt arbejdet uden loops og andet rod. Kør eksemplet og se det selv:

javascript$('.www').html('!!!');