HTML DOM-dokument getElementsByClassName()
Voorbeeld
Kry alle elemente met class="example":
const collection = document.getElementsByClassName("example");
Kry alle elemente met beide die "voorbeeld" en "kleur" klasse:
const collection = document.getElementsByClassName("example color");
Meer voorbeelde hieronder.
Definisie en gebruik
Die getElementsByClassName()metode gee 'n versameling elemente met 'n gespesifiseerde klasnaam(e) terug.
Die getElementsByClassName()metode gee 'n HTMLCollection terug .
Die getElementsByClassName()eiendom is leesalleen.
HTML-versameling
'n HTMLCollection is 'n versameling HTML-nodusse.
Nodusse in 'n versameling kan verkry word deur indeksnommers. Die indeks begin by 0.
Die lengte Eiendom gee die aantal elemente in die versameling terug.
Sien ook:
Die dokument getElementById()-metode
Die dokument getElementsByTagName()-metode
Die Document querySelector() Metode
Sintaksis
document.getElementsByClassName(classname)
Grense
| Parameter | Description |
| classname | Required. The class name of the elements. Search for multiple class names separated by spaces like "test demo". |
Terugkeerwaarde
| Tik | Beskrywing |
| Voorwerp. | 'n HTMLCollection- voorwerp. 'n Versameling elemente met die gespesifiseerde klasnaam. Die elemente word gesorteer soos dit in die dokument verskyn. |
Meer voorbeelde
Aantal elemente met class="example":
let numb = document.getElementsByClassName("example").length;
Verander die agtergrondkleur van alle elemente met class="example":
const collection = document.getElementsByClassName("example");
for (let i = 0; i < collection.length; i++) {
collection[i].style.backgroundColor = "red";
}
Verwante bladsye
CSS-tutoriaal: CSS-sintaksis
CSS-verwysing: CSS .class Selector
HTML DOM-verwysing: element .getElementsByClassName()
HTML DOM Verwysing: klasnaam Eiendom
HTML DOM-verwysing: classList Property
HTML DOM-verwysing: Stylvoorwerp
Blaaierondersteuning
document.getElementsByClassName() is 'n DOM Vlak 1 (1998) kenmerk.
Dit word ten volle ondersteun in alle blaaiers:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | 9-11 | Yes | Yes | Yes | Yes |