dart - 使用 Dart 获取 HTML5 data-* 属性

Question

HTML 5 有一个新的 data attribute data-*

鉴于以下用法:

   <ul>
     <li data-animal-type="bird">Owl</li>
     <li data-animal-type="fish">Salmon</li> 
     <li data-animal-type="spider">Tarantula</li> 
   </ul>

我如何在 Dart 中访问这些属性。

Answer 1

Element类包含一个 dataset 旨在访问(读取和写入)元素上的数据属性的属性。它会自动为您的属性名称加上数据前缀，因此您不必自己动手:

var animalType = listItemElement.dataset['animalType];

一件重要的事情是， dataset attribute 将所有属性名称转换为驼峰式大小写。如果您有 animal-type您需要访问 animalType .
data-前缀是 required for custom attributes that should not affect the layout在 HTML5 中。如果您不使用它，您的文档验证可能不会成功。