html custom attributes legality

Question

So I've found it really convenient to add some custom attributes to html tags and later go over them with a script that then does something to that element based on that attribute. For example

<div hoverText = "i am hover text" hoverTextColor = "rgba(0,0,0,0.2)">some other text</div>

and then, on window load, a script goes through all the elements in the document, picks out the ones that have the attribute "hoverText", looks for other attributes associated with it and does it's various magic (in this case it adds a div with faint text that becomes visible when the user is hovering over the specified element)

It works fine in the browsers I've tested (opera 12, chrome 35) but is there any guarantee that it wont break at some point? Whats do the standards say about custom attributes?

I recommend using the `data-` prefix. https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes — showdev, Sep 08 '14 at 20:52
No, there is no guarantee this won't break at some point. Use `data-` attributes. — user229044, Sep 08 '14 at 20:52

score 2 · Accepted Answer · answered Sep 08 '14 at 20:52

Use data attributes for this purpose. Data attributes are attributes prefixed with data- - this is part of HTML5 and compliant browsers recognize them. Your element would look like

<div data-hoverText="i am hover text" data-hoverTextColor="rgba(0,0,0,0.2)">some other text</div>

html custom attributes legality

1 Answers1