El mètode getElementsByClassName() s'utilitza per seleccionar o obtenir els elements a través del seu valor de nom de classe. Aquest mètode DOM retorna un objecte semblant a una matriu que consta de tots els elements que tenen el nom de classe especificat. En cridar el mètode getElementsByClassName() en qualsevol element concret, cercarà tot el document i retornarà només aquells elements que coincideixen amb el nom de classe especificat o donat.
Sintaxi
var ele=document.getELementsByClassName('name');
Aquí, el nom és l'argument obligatori que s'ha de passar. És la cadena que especifica un sol nom de classe o diversos noms de classe per coincidir.
Exemple del mètode getElementsByClassName().
Vegem alguns exemples per conèixer i entendre la implementació pràctica del mètode.
Exemple
És una implementació de classe senzilla que retorna un objecte semblant a una matriu en invocar la variable 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);
Sortida:
cadena adjunta java
De la mateixa manera, podem implementar el mètode getElementsByClassName() per retornar col·leccions d'elements per a diverses classes.
Diferència entre els mètodes getElementsByClassName(), querySelector() i querySelectorAll()
getElementsByClassName(): Coincideix amb els elements amb el nom de classe especificat i retorna un conjunt dels elements coincidents. Els elements retornats són una col·lecció d'elements HTML en directe. Aquests elements en directe es poden actualitzar encara més si es fa cap canvi al model d'objectes de document.
querySelector(): Només retorna un únic element que coincideixi amb el nom de classe especificat. Si no troba cap element coincident, retorna null.
El punt principal a entendre és que tots els mètodes descrits anteriorment retornen un element o una llista, però el mètode getELementsByClassName() serveix al dinàmic actualització, i els altres dos mètodes serveixen per a estàtica .