HTML 5 has a new data attribute data-*
Given the following usage:
<ul>
<li data-animal-type="bird">Owl</li>
<li data-animal-type="fish">Salmon</li>
<li data-animal-type="spider">Tarantula</li>
</ul>
How could I access these attribute in Dart.
The Element
class contains a dataset
property that is designed to access (read and write) data attributes on element. It automatically prefix your attribute names with data, so you don't have to do it yourself:
var animalType = listItemElement.dataset['animalType];
One important thing is, that the dataset
attribute converts all attribute names to camel-case. If you have animal-type
you need to access animalType
.
The data-
prefix is required for custom attributes that should not affect the layout in HTML5. If you don't use it, validation of your document might not succeed.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With