CustomElementRegistry接口的define()方法定义了一个自定义元素.
这是一个实验中的功能
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。
Syntax
customElements.define(name, constructor, options);
Parameters
- name
- 自定义元素名.
- constructor
- 自定义元素构造器.
- options 可选
- 控制元素如何定义. 目前有一个选项支持:
extends. 指定继承的已创建的元素. 被用于创建自定义元素.
Return value
Void.
Examples
class BasicElement extends HTMLElement {
connectedCallback() {
this.textContent = 'Just a basic custom element.';
}
}
customElements.define('basic-element', BasicElement);
<basic-element><basic-element>
Browser compatibility
Custom Elements are defined in the following specification:
| Specification | Status | Comment |
|---|---|---|
| The HTML Standard: CustomElementRegistry.define() | LS |
We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
| Feature | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | 未实现 | 59.0 | 未实现 | 47.0 | 10.1 |
| Customized built-in elements | 未实现 | 59.0 | 未实现 | 47.0 | 未实现 |
| Feature | Firefox Mobile (Gecko) | Chrome for Android | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | 未实现 | 56.0 | 未实现 | 47.0 | 10.1 |
| Customized built-in elements | 未实现 | 56.0 | 未实现 | 47.0 | 未实现 |