Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>The <a href="https://www.w3.org/TR/custom-elements/" rel="noreferrer">Custom Elements specification</a> is available in Chrome and Opera, and becoming available in <a href="http://caniuse.com/#feat=custom-elements" rel="noreferrer">other browsers</a>. It provides a means to register custom elements in a formal manner.</p> <blockquote> <p>Custom elements are new types of DOM elements that can be defined by authors. Unlike <a href="http://www.w3.org/TR/2013/WD-components-intro-20130606/#decorator-section" rel="noreferrer">decorators</a>, which are stateless and ephemeral, custom elements can encapsulate state and provide script interfaces.</p> </blockquote> <p>Custom elements is a part of a larger W3 specification called <a href="https://www.w3.org/standards/techs/components" rel="noreferrer">Web Components</a>, along with Templates, HTML Imports, and Shadow DOM.</p> <blockquote> <p>Web Components enable Web application authors to define widgets with a level of visual richness and interactivity not possible with CSS alone, and ease of composition and reuse not possible with script libraries today.</p> </blockquote> <p>However, from this <a href="https://developers.google.com/web/fundamentals/primers/customelements/" rel="noreferrer">excellent walk through article</a> on Google Developers about Custom Elements v1:</p> <blockquote> <p>The name of a custom element must contain a dash (<code>-</code>). So <code>&lt;x-tags&gt;</code>, <code>&lt;my-element&gt;</code>, and <code>&lt;my-awesome-app&gt;</code> are all valid names, while <code>&lt;tabs&gt;</code> and <code>&lt;foo_bar&gt;</code> are not. This requirement is so the HTML parser can distinguish custom elements from regular elements. It also ensures forward compatibility when new tags are added to HTML.</p> </blockquote> <p><strong>Some Resources</strong></p> <ul> <li>A "gallery" of Web Components is being compiled at <a href="http://customelements.io/" rel="noreferrer">http://customelements.io/</a></li> <li><a href="http://webcomponents.org/polyfills/" rel="noreferrer">WebComponents.js</a> serves as a polyfill for Web Components until they are supported everywhere. See also the <a href="https://github.com/WebComponents/webcomponentsjs" rel="noreferrer">WebComponents.js github page &amp; web browser support table</a>.</li> </ul>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload