HTML DOM setAttribute() Metoda
❮ Obiekt elementuPrzykład
Dodaj atrybut class o wartości „democlass” do elementu <h1>:
document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");
Przed ustawieniem atrybutu:
Hello World
Po ustawieniu atrybutu:
Hello World
Więcej przykładów „Wypróbuj sam” poniżej.
Definicja i użycie
Metoda setAttribute() dodaje określony atrybut do elementu i nadaje mu określoną wartość.
Jeśli określony atrybut już istnieje, ustawiana/zmieniana jest tylko wartość.
Uwaga: Chociaż możliwe jest dodanie atrybutu stylu z wartością do elementu za pomocą tej metody, zaleca się używanie właściwości obiektu Style zamiast stylizacji w tekście, ponieważ nie zastąpi to innych właściwości CSS, które mogą być określone w atrybut stylu:
Zły:
element.setAttribute("style", "background-color: red;");
Dobry:
element.style.backgroundColor = "red";
Wskazówka: Użyj metody removeAttribute() , aby usunąć atrybut z elementu.
Wskazówka: Zobacz także metodę setAttributeNode() .
Obsługa przeglądarki
Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje tę metodę.
| Method | |||||
|---|---|---|---|---|---|
| setAttribute() | Yes | 8.0 | Yes | Yes | Yes |
Składnia
element.setAttribute(attributename, attributevalue)
Wartości parametrów
| Parameter | Type | Description |
|---|---|---|
| attributename | String | Required. The name of the attribute you want to add |
| attributevalue | String | Required. The value of the attribute you want to add |
Szczegóły techniczne
| Wartość zwrotu: | Brak wartości zwrotu |
|---|---|
| Wersja DOM | Obiekt elementu podstawowego poziomu 1 |
Więcej przykładów
Przykład
Zmień pole wprowadzania na przycisk wprowadzania:
document.getElementsByTagName("INPUT")[0].setAttribute("type", "button");
Przed ustawieniem atrybutu:
Po ustawieniu atrybutu:
Przykład
Dodaj atrybut href o wartości „www.w3schools.com” do elementu <a>:
document.getElementById("myAnchor").setAttribute("href", "https://www.w3schools.com");
Przed ustawieniem atrybutu:
Po ustawieniu atrybutu:
Przykład
Dowiedz się, czy element <a> ma atrybut target. Jeśli tak, zmień wartość atrybutu docelowego na „_self”:
// Get the <a> element with id="myAnchor"
var x = document.getElementById("myAnchor");
// If the <a> element has a target attribute, set the value to "_self"
if (x.hasAttribute("target")) {
x.setAttribute("target", "_self");
}
Powiązane strony
Samouczek HTML: atrybuty HTML
Dokumentacja HTML DOM: metoda getAttribute()
Dokumentacja HTML DOM: metoda hasAttribute()
Dokumentacja HTML DOM: metoda removeAttribute()
❮ Obiekt elementu