HTML data-* Özelliği

Tanım ve Kullanım

data-* Bu özellik, sayfa veya uygulamanın özel özelleştirilmiş verilerini depolamak için kullanılır.

data-* Bu özellik, tüm HTML elemanlarına özelleştirilmiş data özellikleri eklememizi sağlar.

Depolanan (özelleştirilmiş) veriler, sayfanın JavaScript'inde kullanılarak, Ajax çağrıları veya sunucu tarafı veritabanı sorguları yapılmadan daha iyi kullanıcı deneyimi yaratılabilir.

data-* Özellik iki bölümden oluşur:

  • Özellik adı herhangi bir büyük harf içermemelidir ve "data-" ön ekinden sonra en az bir karakter olmalıdır
  • Özellik değeri herhangi bir dizgi olabilir

Dikkat: Kullanıcı aracısı, "data-" öne ekli olan özelleştirilmiş özelliklerin önünü tamamen göz ardı eder.

Ayrıca bakınız:

HTML Eğitimi:HTML özellikleri

HTML DOM Kaynak Kılavuzu:HTML DOM getAttribute() Metodu

Örnek

Kendi verilerinizi yerleştirmek için data-* özelliği kullanın:

<ul>
  <li data-animal-type="鸟类">喜鹊</li>
  <li data-animal-type="鱼类">金枪鱼</li>
  <li data-animal-type="蜘蛛">苍蝇虎</li>
</ul>

Kişisel olarak deneyin

Sözdizimi

<element data-*="somevalue">

Özellik değeri

Değer Açıklama
somevalue Özelliğin değerini (dizgi olarak) belirler.

Tarayıcı desteği

Tablo içindeki rakamlar, bu özelliği ilk tam olarak destekleyen tarayıcı sürümünü belirtir.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 5.5 2.0 3.1 9.6