使用Dart获取HTML5 data-*属性

Question

HTML 5具有新的数据属性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属性将所有属性名称转换为驼峰大小写.如果您animal-type需要访问animalType.

该data-前缀是必需的,不应该影响到布局自定义属性在HTML5.如果您不使用它,您的文档验证可能不会成功.