Like the title says, is there any reason I can't create arbitrary names for my own attributes?
Asked
Active
Viewed 270 times
0
-
1Besides a desire to keep your HTML valid? No. – Heretic Monkey Apr 05 '21 at 17:32
-
2Future-proof comes out of mind. If you use a random name and a latter version of HTML happens to include it, your page is suddenly changed in an unexpected way. Data attributes are guarranted to remain application-specific. – Alejandro Apr 05 '21 at 17:32
-
Search engines might penalise you if the site uses unknown tags and attributes, too. Data prevents that, if that's the case. – Alejandro Apr 05 '21 at 17:34
-
They also won't make a validator choke. – Spectric Apr 05 '21 at 17:35
-
If other devs work with your codebase, it would be easier for them. Since using `data-` is a well known standard. – Tom Bombadil Apr 05 '21 at 17:36
-
Good points, but @Alejandro on future proofing it's no different with data-attributes as you may use some other js library that used the same ones you did. Of all the concerns, this one is the least of them to me. Supposing a conflict "did" happen here, it would be a simple matter of using find/replace to update and if you have a really large application it might, you know, take an hour. More likely it will take you less than 10 minutes plus time to test. – BVernon Apr 05 '21 at 18:03
-
@BVernon I strongly disagree con your optimism about fix time for such a conflict :) I find it difficult to even know that a conflict happened in the first place. Good point about libraries, didn't even consider that as a chance. – Alejandro Apr 05 '21 at 18:10
1 Answers
4
Yes.
MDN: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes
Clean "namespace": You don't need to restrict yourself about which attributes you can use.
data-bgcolor
is safe to use,bgcolor
is not.Semantics: The way data and non-data attributes are accessed is different. Usually, attributes will be retrieved using
el.getAttribute("value")
, while data attributes will be access withel.dataset.value
. This is no confusion about what the attribute does (is it visual or not).It's standard: HTML5 declares a specific set of valid attributes. Going against standards should generally be avoided.

Slava Knyazev
- 5,377
- 1
- 22
- 43
-
I really don't care about 1) and 3) (I just mean I've never been one to follow rules based on "just because" reasoning), but point 2 is compelling... actually I didn't even know you could do that, so thanks! – BVernon Apr 05 '21 at 18:12