What happens if I don't preface data attributes with “data-”?

Question

I frequently end up storing data in DOM elements and make heavy use of custom data attributes and JQuery. I know the HTML5 spec says data attributes should have the data- prefix, but as far as I can tell there's no harm in naming my attributes whatever I want.

Problem?

Answer 1

The only problem is in validation. Non-standard element attributes are not valid HTML5. So, there is no harm in them, but the danger of operating outside of any spec is that it may not be supported in the future or by a specific user-agent. You also run the risk that in the future, the spec will include your non-standard attribute, but it will mean something else entirely than what you intended. Worse case scenario, you have to go update the page when a new feature of the spec is implemented.

In the case of element attributes, it should work in all browsers.

Check out http://msdn.microsoft.com/en-us/library/ms536429%28VS.85%29.aspx for info on this subject as it pertains to Internet Explorer.

Answer 2

If you're OK with invalid HTML, then there's no problem. People have been doing it your way for years, so it's unlikely that any browsers will break the behavior you expect.