Custom Attributes in HTML 5
Created: May 26th, 09
This is because custom attributes of any type isn't part of HTML's specs, until now that is. Based on growing pressure from the webmaster community, HTML 5 has finally given in, by giving us a new "data" attribute that lets you define custom attributes in a structured way within HTML elements. Lets see what that's all about, and how it's useful.
Defining and parsing the data attribute
In HTML 5, you define custom attributes using the "data" attribute. The exact format is "data-*", where "*" is replaced with the desired custom attribute name, then set to the desired string value. For example:
Your attribute name must be prefixed with "
The appeal of custom attributes is that it lets you easily associate
for example. There are two ways to retrieve the value of "data"
Before you go wild with the "
The HTML 5 doctype
Since the "data" attribute is the brainchild of HTML 5, your page should carry a doctype that informs the W3C validator of this if you want the page to validate (after all, isn't that the whole point?). The common XHTML or HTML 4 doctypes will fail, as the "data" attribute is a fish out of the water in those settings. So what to use? W3C advocates the very simple doctype:
for HTML 5. Now, don't let the simplicity of this doctype fool you- it not only validates the document as HTML 5, but also causes all browsers to render the web page is standards compliant mode, similar to what the other proper doctypes do.