Is It Ok to Use Unknown HTML Tags

Is it OK to use unknown HTML tags?

You should always approach HTML as it is defined in its respective specification. "Defining" new tags is a bit of an extreme approach. It might pass a browser check because it implements various failsafes, but there is no guarantee of this. You're entering the land of Undefined Behaviour, at best. Not to mention you will fail validation tests, but you seem to be aware of that.

If you wish to be more semantically expressive in your markup, you can use HTML5 which defines quite a bit of more descriptive tags for describing the structure of your page instead of generic divs which need to be appended ids or classes.

In the end, a short answer: No, it's bad practice, you shouldn't do it and there could be unforeseen problems later on in your development.

Unknown html tag type

This is XML or XHTML where the namespace is declared as html. It should be part of a larger amount of markup where the namespace is declared and a prologue. It is not the same thing as your second form which is, I assume, your HTML interpretation of that.

Typically the first form you show would be interpreted into HTML or XHTML using XSLT or other program. The <input> tags need not have a closing slash in HTML.

XML Namespaces might get you started.

Unknown tags in HTML

Since it is related to backbone.js, it would be an underscore.js template. Have a look here or here for some examples and more information on how to use it. One way to find out if it is used by a JavaScript templating engine would be to find out if it lives inside a <script> tag. It is quite likely that you copied that code snippet out of a script block that looked similar to this <script type="text/template"></script>, if it was an underscore.js template. I personally don't know any other JavaScript templating engines which use the exact same syntax as underscore.js, there could be another one out there.

Showing error: Unknown HTML tag

You can mark the string/var as a 'language injection':

1. Place the caret inside the string literal, tag, or attribute, in
   which you want to inject a language and press Alt+Enter (or use the
   intention action icon Intention action icon).
2. Select Inject language or reference and choose the language you want
   to inject.

https://www.jetbrains.com/help/phpstorm/using-language-injections.html

The result looking like this:

$xmlString = /** @lang XML */
'<?xml version="1.0" encoding="utf-8" ?>';

Angular 2 (click) with unknown html tags

I guess console is not defined inside template. Try creating method in shape component which will execute console.log()

How are non-standard tags processed by browser?

I guess the only interesting thing to note is that unknown elements such as the <close></close> element in the question expose HTMLUnknownElement interface in the DOM.

Otherwise there’s nothing exceptional about how browsers process them. The HTML parsers in browsers parse them into the DOM just as they would normal known elements.

As far as the part of the question about whether unknown elements require more resources to be processed: given that browsers don’t do anything special with them, the browser resource requirements for handling them are no different than they would be for a div or whatever.

---

Related Topics