Custom Elements - Naming Collisions Extending HTMLElement

407 Views Asked by At

Custom Elements are created by extending the HTMLElement class.

Therefore, when you create one, is seems you'd have to take special precautions not to give your Custom Element any custom-property-names that are already inherited from HTMLElement.

I can imagine numerous ways of avoiding these potential naming conflicts, but would be interested in other's suggestions or any best practices on the topic.

1

There are 1 best solutions below

0
On BEST ANSWER

As suggested by @Jared Smith, the best practice would be to use hyphenated names, and more precisely the data-* notation, accessible via the dataset property.

Note that the aria-* notation should not be used because it is reserved for accessibility.

In the end you can choose any name, except the global attributes, or the specific attributes if you extend a standard HTML element.