How to create a valid custom tag/element in HTML5?
Example 1:
<customTag attr1="val" attr2="val"> </customTag> Example 2:
<my:customTag attr1="val" attr2="val"> </my:customTag> <!-- attention to the COLON separator --> Thanks.
- In my experience it's the first example.Barnee– Barnee2013-03-13 07:48:25 +00:00Commented Mar 13, 2013 at 7:48
Add a comment |
4 Answers
i don't think you need the colon. neither xtags (mozilla lib) or w3c spec show them in their examples. xtags: http://x-tags.org/ w3c: https://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html#decorators-example
Comments
Using your own made up elements is not valid HTML.
From the W3C spec:
Authors must not use elements, attributes, or attribute values that are not permitted by this specification or other applicable specifications, as doing so makes it significantly harder for the language to be extended in the future.
3 Comments
albert
ah but custom elements are allowed. quite a quandry dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/…
ThinkingStiff
@albert It doesn't allow you to put
<madeupelement> into your HTML. It's a new attribute is that you add to an element like is="madeupelement" after being defined with the <element> element.albert
damn...good catch. xtags does let you, but didn't make it into the web components api...probably becasuse of the reasons in the answer you first posted. my bad.
Custom Elements are a real W3 DOM API and will soon validate - honestly, don't worry about validation in such cases, it's irrelevant. The spec for Custom Elements is being actively implemented in both Firefox and Chrome - currently on nightly builds.
You do not need a colon in your tag name, this is not an XML namespace. However, the tag is required to have a dash somewhere in the custom element name, per the spec: https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/custom/index.html
Comments
The W3C Custom Element spec says, you can define custom tags, and the only requirement is that it contains a hyphen, not a colon.
