Web/HTML/Global attributes/is

From Get docs


The is global attribute allows you to specify that a standard HTML element should behave like a defined custom built-in element (see Using custom elements for more details).

This attribute can only be used if the specified custom element name has been successfully defined in the current document, and extends the element type it is being applied to.

Examples

The following code is taken from our word-count-web-component example ([[../../../../../../../mdn.github.io/web-components-examples/word-count-web-component/index|see it live also]]).

// Create a class for the element
class WordCount extends HTMLParagraphElement {
  constructor() {
    // Always call super first in constructor
    super();

    // Constructor contents ommitted for brevity
    ...

  }
}

// Define the new element
customElements.define('word-count', WordCount, { extends: 'p' });
<p is="word-count"></p>

Specifications

Specification Status Comment
HTML Living StandardThe definition of 'is' in that specification. Living Standard  

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
is Chrome

Full support 67

Edge

Full support 79

Firefox Full support 63


Full support 63


No support 59 — 63

Disabled'

Disabled' From version 59 until version 63 (exclusive): this feature is behind the dom.webcomponents.customelements.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config. No support ? — 59

Disabled'

Disabled' Until version 59 (exclusive): this feature is behind the dom.webcomponents.enabled preference (needs to be set to true) and the dom.webcomponents.customelements.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

IE

No support No

Opera

Full support 55

Safari

No support No

WebView Android

Full support 67

Chrome Android

Full support 67

Firefox Android Full support 63


Full support 63


No support 59 — 63

Disabled'

Disabled' From version 59 until version 63 (exclusive): this feature is behind the dom.webcomponents.customelements.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config. No support ? — 59

Disabled'

Disabled' Until version 59 (exclusive): this feature is behind the dom.webcomponents.enabled preference (needs to be set to true) and the dom.webcomponents.customelements.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

Opera Android

Full support 48

Safari iOS

No support No

Samsung Internet Android

Full support 9.0

Legend

Full support  
Full support
No support  
No support
User must explicitly enable this feature.'
User must explicitly enable this feature.


See also

is by Mozilla Contributors is licensed under CC-BY-SA 2.5.