From d9143342090c96bb13317867fefa851e4f0ad5bd Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Mon, 17 Jan 2022 23:16:48 +0900 Subject: 2021/09/15 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/api/window/customelements/index.md | 67 +++++++++---------------- 1 file changed, 24 insertions(+), 43 deletions(-) (limited to 'files/ja/web/api') diff --git a/files/ja/web/api/window/customelements/index.md b/files/ja/web/api/window/customelements/index.md index 3477445e1e..6e3b95db14 100644 --- a/files/ja/web/api/window/customelements/index.md +++ b/files/ja/web/api/window/customelements/index.md @@ -4,36 +4,32 @@ slug: Web/API/Window/customElements tags: - API - CustomElementRegistry - - Webコンポーネント - - Window - - custom elements - - customElements - プロパティ - リファレンス + - ウェブコンポーネント + - Window + - カスタム要素 + - customElements +browser-compat: api.Window.customElements translation_of: Web/API/Window/customElements --- -
{{APIRef}}
- -

{{domxref("Window")}} インターフェイスの読み取り専用 customElements プロパティは、 新しいカスタムエレメントを登録し、かつ以前に登録したカスタムエレメントに関する情報を取得する事ができる {{domxref("CustomElementRegistry")}} オブジェクトへのリファレンスを返します。

+{{APIRef}} -

構文

+**`customElements`** は {{domxref("Window")}} インターフェイスの読み取り専用プロパティで、 {{domxref("CustomElementRegistry")}} オブジェクトへのリファレンスを返します。これにより、新しい[カスタム要素](/ja/docs/Web/Web_Components/Using_custom_elements)を登録したり、以前に登録したカスタム要素に関する情報を取得したりすることができます。 -
let customElementRegistry = window.customElements;
+## 例 -

戻り値

+このプロパティが使われている最も一般的な例は、新しいカスタム要素を定義・登録するために {{domxref("CustomElementRegistry.define()")}} メソッドにアクセスすることです。例えば次のようにします。 -

{{domxref("CustomElementRegistry")}} オブジェクトは現在の window の カスタムエレメントレジストリ を表すインスタンスです。

+```js +let customElementRegistry = window.customElements; +customElementRegistry.define('my-custom-element', MyCustomElement); +``` -

+しかし、ふつうは以下のように短縮します。 -

このプロパティが使われている最も一般的な例は、新しいカスタムエレメントを定義・登録するために {{domxref("CustomElementRegistry.define()")}} メソッドにアクセスすることです, 例えば:

- -
let customElementRegistry = window.customElements;
-customElementRegistry.define('my-custom-element', MyCustomElement);
- -

しかし、通常は以下のように短縮されます:

- -
customElements.define('element-details',
+```js
+customElements.define('element-details',
   class extends HTMLElement {
     constructor() {
       super();
@@ -42,32 +38,17 @@ customElementRegistry.define('my-custom-element', MyCustomElement);
.content; const shadowRoot = this.attachShadow({mode: 'open'}) .appendChild(template.cloneNode(true)); + } } -}); - -

我々の web-components-examples リポジトリにより多くの使用例がありますのでご参照ください。

- -

仕様

+); +``` - - - - - - - - - - - - - -
仕様ステータスコメント
{{SpecName("HTML WHATWG", "custom-elements.html#dom-window-customelements", "window.customElements")}}{{Spec2("HTML WHATWG")}}初期定義。
+[web-components-examples](https://github.com/mdn/web-components-examples/) リポジトリーにより多くの使用例がありますので参照してください。 -

ブラウザ互換性

+## 仕様書 -
+{{Specifications}} +## ブラウザーの互換性 -

{{Compat("api.Window.customElements")}}

-
+{{Compat}} -- cgit v1.2.3-54-g00ecf