register

Summary

Registers a new, custom element and returns the element’s constructor.

Syntax

var XFoo = document.register(/* see parameter list */);

Parameters

type

Data-type: String

The custom element’s tag name. The name must contain a dash (-). So for example, <x-foo>, <foo-element>, and <my-foo-element> are valid names, while <tabs> and <foo_bar> are not.

options

Data-type: Object

(Optional)

The object describing the element’s prototype, public properties and methods.

Return Value

Returns an object of type ObjectObject

Examples

var XFoo = document.register('x-foo');
document.body.appendChild(new XFoo());

Registers the custom element and defines the element’s prototype.

var XFoo = document.register('x-foo', {
  prototype: Object.create(HTMLElement.prototype, {
    bar: {
      get: function() { return 5; }
    },
    foo: {
      value: function() {
        alert('foo() called');
      }
    }
  })
});

Notes

The custom element name must not be one of the following existing hyphen-containing element names:

annotation-xml
color-profile
font-face
font-face-src
font-face-uri
font-face-format
font-face-name
missing-glyph

Related specifications

Custom Elements
:

Attributions

Portions of this content come from HTML5Rocks! article