Window: customElements プロパティ
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2020年1月.
customElements は Window インターフェイスの読み取り専用プロパティで、 CustomElementRegistry オブジェクトへのリファレンスを返します。これにより、新しいカスタム要素を登録したり、以前に登録したカスタム要素に関する情報を取得したりすることができます。
例
このプロパティが使われている最も一般的な例は、新しいカスタム要素を定義・登録するために CustomElementRegistry.define() メソッドにアクセスすることです。例えば次のようにします。
js
let customElementRegistry = window.customElements; customElementRegistry.define("my-custom-element", MyCustomElement); しかし、ふつうは以下のように短縮します。
js
customElements.define( "element-details", class extends HTMLElement { constructor() { super(); const template = document.getElementById( "element-details-template", ).content; const shadowRoot = this.attachShadow({ mode: "open" }).appendChild( template.cloneNode(true), ); } }, ); web-components-examples リポジトリーにより多くの使用例がありますので参照してください。
仕様書
| Specification |
|---|
| HTML # dom-window-customelements |
ブラウザーの互換性
Loading…