Dane HTML- * Atrybuty
Przykład
Użyj atrybutu data-*, aby osadzić niestandardowe dane:
<ul>
<li data-animal-type="bird">Owl</li>
<li data-animal-type="fish">Salmon</li>
<li data-animal-type="spider">Tarantula</li>
</ul>
Definicja i użycie
Atrybuty data-*służą do przechowywania niestandardowych danych prywatnych dla strony lub aplikacji.
Atrybuty data-*dają nam możliwość osadzania niestandardowych atrybutów danych we wszystkich elementach HTML.
Przechowywane (niestandardowe) dane można następnie wykorzystać w JavaScript strony, aby stworzyć bardziej angażujące środowisko użytkownika (bez żadnych wywołań Ajax lub zapytań do bazy danych po stronie serwera).
Atrybuty data-*składają się z dwóch części:
- Nazwa atrybutu nie powinna zawierać wielkich liter i musi mieć co najmniej jeden znak po prefiksie „data-”
- Wartość atrybutu może być dowolnym ciągiem
Uwaga: niestandardowe atrybuty poprzedzone przedrostkiem „data-” będą całkowicie ignorowane przez klienta użytkownika.
Obsługa przeglądarki
Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje ten atrybut.
| Attribute | |||||
|---|---|---|---|---|---|
| data-* | 4.0 | 5.5 | 2.0 | 3.1 | 9.6 |
Składnia
<element data-*="somevalue">
Wartości atrybutów
| Value | Description |
|---|---|
| somevalue | Specifies the value of the attribute (as a string) |
Powiązane strony
Samouczek HTML: atrybuty HTML
Dokumentacja HTML DOM: Metoda HTML DOM getAttribute()