Endring av elementtekst gjennom jQuery
I tidligere leksjoner lærte vi hvordan vi henter
en gruppe elementer gjennom jQuery og vi så til og med
noen eksempler på arbeid med metoder. Nå
skal vi se nærmere på dem. I denne leksjonen
vil vi lære hvordan vi endrer teksten til et element ved hjelp av to
metoder: html og
text.
La oss løse følgende oppgave: vi henter alle elementene
med klassen www og samtidig endrer
teksten for alle til '!!!'. La oss si at vi har
følgende HTML-kode:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
Da vil JavaScript-koden se slik ut:
let elems = document.getElementsByClassName('www');
for (let i = 0; i < elems.length; i++) {
elems[i].innerHTML = '!!!';
}
Gjennom jQuery blir alt mye enklere: vi henter
alle elementene ved hjelp av dollar, slik:
$('.www'), og deretter bruker vi metoden
html på dem,
som tar den nye teksten som parameter -
$('.www').html('new text'). Det er alt! Denne
linjen vil utføre alt arbeidet uten noen løkker eller
annet tull. Kjør eksempelet og se det
selv:
$('.www').html('!!!');
Gi alle h3 teksten '!!!'
ved hjelp av metoden html.