GetElementsByClassName()-menetelmää käytetään elementtien valitsemiseen tai hankkimiseen luokan nimiarvon kautta. Tämä DOM-menetelmä palauttaa taulukon kaltaisen objektin, joka koostuu kaikista elementeistä, joilla on määritetty luokkanimi. Kutsuttaessa getElementsByClassName()-metodia mille tahansa tietylle elementille, se etsii koko asiakirjasta ja palauttaa vain ne elementit, jotka vastaavat määritettyä tai annettua luokan nimeä.
Syntaksi
var ele=document.getELementsByClassName('name');
Tässä nimi on pakollinen välitettävä argumentti. Se on merkkijono, joka määrittää joko yhden luokan nimen tai useita luokkanimiä vastaamaan.
Esimerkki getElementsByClassName() -menetelmästä
Katsotaanpa joitain esimerkkejä menetelmän käytännön toteutuksen tuntemiseksi ja ymmärtämiseksi.
Esimerkki
Se on yksinkertainen luokkatoteutus, joka palauttaa taulukon kaltaisen objektin kutsuessaan muuttujaa x.
<h5>DOM Methods </h5> This is a simple class implementation var x=document.getElementsByClassName('Class'); document.write('On calling x, it will return an arrsy-like object: <br>'+x);
Lähtö:
r c-kielellä
Vastaavasti voimme toteuttaa getElementsByClassName()-menetelmän elementtikokoelmien palauttamiseksi useille luokille.
Ero getElementsByClassName(), querySelector()- ja querySelectorAll()-menetelmien välillä
getElementsByClassName(): Se sovittaa elementit määritetyn luokan nimen kanssa ja palauttaa joukon vastaavia elementtejä. Palautetut elementit ovat live-HTML-elementtejä. Näitä live-elementtejä voidaan päivittää edelleen, jos dokumenttiobjektimalliin tehdään muutoksia.
querySelector(): Se palauttaa vain yhden elementin, joka vastaa määritettyä luokan nimeä. Jos se ei löydä mitään vastaavaa elementtiä, se palauttaa null.
Tärkeintä on ymmärtää, että kaikki yllä kuvatut menetelmät palauttavat joko yhden elementin tai luettelon, mutta getELementsByClassName() -menetelmä palvelee dynaaminen päivitys, ja kaksi muuta menetelmää palvelevat staattinen .