(Disclaimer)
Custom data attributes are intended to store custom data private to the page or application, for which there are no more appropriate attributes or elements.
These attributes are not intended for use by software that is independent of the site that uses the attributes.
<div class="user" data-updated="2014-03-11" data-anim="slide">...</div>
Learn More“But I don't wanna put 'Data-'
on my custom attributes.
It works fine without them.”
<div class="user" data-updated="2014-03-11" data-anim="slide">...</div>
el.dataset returns:
{
updated: "2014-03-11",
anim: "slide"
}
<input type="file" accept="image/*" data-loaded="nextStep" />
Because I haven't memorized this list:
accept accept-charset accesskey action align alt async autocomplete autofocus autoplay bgcolor border buffered challenge charset checked cite class code codebase color cols colspan content contenteditable contextmenu controls coords data datetime default defer dir dirname disabled download draggable dropzone enctype for form headers height hidden high href hreflang http-equiv icon id ismap itemprop keytype kind label lang language list loop low manifest max maxlength media method min multiple name novalidate open optimum pattern ping placeholder poster preload pubdate radiogroup readonly rel required reversed rows rowspan sandbox spellcheck scope scoped seamless selected shape size sizes span src srcdoc srclang start step style summary tabindex target title type usemap value width wrap
Today:
accept accept-charset accesskey action align alt async autocomplete ...
Tomorrow:
All of today's attributes plus: ???