2021/09/15 時点の英語版に基づき新規翻訳

1 files changed, 55 insertions, 0 deletions

diff --git a/files/ja/web/api/element/assignedslot/index.md b/files/ja/web/api/element/assignedslot/index.md
new file mode 100644
index 0000000000..47cbb74ec2
--- /dev/null
+++ b/files/ja/web/api/element/assignedslot/index.md
@@ -0,0 +1,55 @@
+---
+title: Element.assignedSlot
+slug: Web/API/Element/assignedSlot
+tags:
+  - API
+  - プロパティ
+  - リファレンス
+  - Slottable
+  - ウェブコンポーネント
+  - assignedSlot
+  - シャドウ DOM
+browser-compat: api.Element.assignedSlot
+translation_of: Web/API/Element/assignedSlot
+---
+{{APIRef("Shadow DOM")}}
+
+**`assignedSlot`** は {{domxref("Element")}} インターフェイスの読み取り専用プロパティで、
+{{domxref("HTMLSlotElement")}} を返します。これは、そのノードが挿入された {{htmlelement("slot")}} 要素を表します。
+
+## 構文
+
+```js
+var slotElement = elementInstance.assignedSlot
+```
+
+### 値
+
+{{domxref('HTMLSlotElement')}} のインスタンス、または要素がスロットに割り当てられていない場合や、 {{domxref("ShadowRoot.mode", "mode")}} が `closed` に設定されている場合は `null` です（詳しくは {{domxref("Element.attachShadow")}} を参照してください）。
+
+## 例
+
+[simple-template の例](https://github.com/mdn/web-components-examples/tree/master/simple-template) ([ライブで表示](https://mdn.github.io/web-components-examples/simple-template/)) では、 `<my-paragraph>` という些細なカスタム要素の例を作りました。この要素にはシャドウルートが付けられ、次に `my-text` というスロットを含むテンプレートのコンテンツを使って入力されるようになっています。
+
+文書内で `<my-paragraph>` が使用されると、スロットは `my-text` という値を持つ [`slot`](/ja/docs/Web/HTML/Global_attributes/slot) 属性を持つ要素内に含めることによって、 slotable 要素によって生成されることになります。以下はそのような例です。
+
+```html
+<my-paragraph>
+  <span slot="my-text">Let's have some different text!</span>
+</my-paragraph>
+```
+
+JavaScript ファイルでは、上に示した {{htmlelement("span")}} への参照を取得し、 `<span>` が挿入された元の `<slot>` 要素への参照をログに記録しています。
+
+```js
+let slottedSpan = document.querySelector('my-paragraph span')
+console.log(slottedSpan.assignedSlot); // logs '<slot name="my-text">'
+```
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}