Przykład
Pobierz wszystkie elementy o określonej nazwie klasy:
var x =
document.getElementsByClassName("example");
Spróbuj sam " Więcej "Try it Yourself" przykłady poniżej.
Definicja i Wykorzystanie
getElementsByClassName() Metoda zwraca kolekcję wszystkich elementów w dokumencie o określonej nazwie klasy jako NodeList obiektu.
Przedmiotem NodeList reprezentuje zbiór węzłów. Węzły mogą być dostępne za pomocą numerów indeksowych. Indeks zaczyna się od 0.
Wskazówka: Można użyć length właściwość obiektu NodeList określić liczbę elementów o podanej nazwie klasy, można pętli wszystkich elementów i wyodrębnić informacje, które chcesz.
Wsparcie przeglądarka
Liczby w tabeli określa pierwszą wersję przeglądarki, która w pełni obsługuje metodę.
| metoda | |||||
|---|---|---|---|---|---|
| getElementsByClassName() | 4.0 | 9.0 | 3.0 | 3.1 | 9.5 |
Składnia
document.getElementsByClassName( classname )wartości parametrów
| Parametr | Rodzaj | Opis |
|---|---|---|
| classname | String | Wymagany. Nazwa klasy elementów, które chcesz uzyskać. Aby wyszukać wiele nazw klas, rozdzielając je spacjami, jak "test demo" . |
Szczegóły techniczne
| DOM wersja: | Rdzeń Poziom 1 Document Object |
|---|---|
| Zwracana wartość: | Obiekt NodeList, stanowiących zbiór elementów o podanej nazwie klasy. Elementy w zwróconym kolekcji są klasyfikowane jako wydają w kodzie źródłowym. |
Więcej przykładów
Przykład
Uzyskać wszystkie elementy z obu "example" i "color" klas:
var x =
document.getElementsByClassName("example color"); Spróbuj sam " Przykład
Dowiedzieć się, jak wiele elementów z class = „przykład” istnieją w dokumencie (za pomocą właściwości length obiektu NodeList):
var x =
document.getElementsByClassName("example").length; Spróbuj sam " Przykład
Zmienić kolor tła wszystkich elementów z class = „przykład”:
var x = document.getElementsByClassName("example");
var i;
for (i = 0;
i < x.length; i++) {
x[i].style.backgroundColor =
"red";
} Spróbuj sam " Podobne strony
CSS: CSS selektory
CSS: CSS Selector .class
HTML DOM: pierwiastek. getElementsByClassName()
HTML DOM: className Property
HTML DOM: classList Property
HTML DOM: Style obiektu