HTML
Atrybuty danych

Składnia

• <element data-custom-name="somevalue">

Parametry

Zastosowanie atrybutu danych

Atrybuty data-* HTML5 data-* zapewniają wygodny sposób przechowywania danych w elementach HTML. Zapisane dane można odczytać lub zmodyfikować za pomocą JavaScript

<div data-submitted="yes" class="user_profile">
  … some content …
</div>

• Struktura atrybutu data-* to data-* , tzn. Nazwa atrybutu danych znajduje się po części data- . Przy użyciu tej nazwy można uzyskać dostęp do atrybutu.

• Dane w formacie ciągu (w tym json ) można przechowywać za pomocą atrybutu data-* .

Obsługa starszych przeglądarek

Atrybuty danych zostały wprowadzone w HTML5, który jest obsługiwany przez wszystkie nowoczesne przeglądarki, ale starsze przeglądarki przed HTML5 nie rozpoznają atrybutów danych.

Jednak w specyfikacjach HTML atrybuty, które nie są rozpoznawane przez przeglądarkę, muszą zostać pozostawione same sobie, a przeglądarka po prostu je zignoruje podczas renderowania strony.

Deweloperzy stron internetowych wykorzystali ten fakt do stworzenia niestandardowych atrybutów, które są dowolnymi atrybutami nie będącymi częścią specyfikacji HTML. Na przykład atrybut value w poniższym wierszu jest uważany za niestandardowy atrybut, ponieważ specyfikacje <img> nie mają atrybutu value i nie jest atrybutem globalnym:

<img src="sample.jpg" value="test" />

Oznacza to, że chociaż atrybuty danych nie są obsługiwane w starszych przeglądarkach, nadal działają i można je ustawiać i pobierać za pomocą tej samej ogólnej metody JavaScript setAttribute i getAttribute , ale nie można używać nowej właściwości dataset która jest obsługiwana tylko w nowoczesnych przeglądarkach.