HTML <slot> 元素

HTML <slot> 元素 — Web 组件的技术套件中一部分 — 是 Web 组件中的一个占位符，可以用来插入自己的标记文本，让你创建单独的 DOM 树并将它们展示在一起。

特性

内容类别	流式内容，短语内容。
允许的内容	透明内容模型
标签省略	不允许，开始标签和结束标签都不能省略。
允许的父元素	任何接受短语内容的元素。
允许的 ARIA 角色	无
DOM 接口	HTMLSlotElement

属性

该元素包含了全局属性。

name

Slot 的名称.

一个 已命名的插槽（named slot） 是指一个带有 name 属性的 <slot> 元素。

实例

<template id="element-details-template">
  <style>
    details {font-family: "Open Sans Light",Helvetica,Arial}
    .name {font-weight: bold; color: #217ac0; font-size: 120%}
    h4 { margin: 10px 0 -8px 0; }
    h4 span { background: #217ac0; padding: 2px 6px 2px 6px }
    h4 span { border: 1px solid #cee9f9; border-radius: 4px }
    h4 span { color: white }
    .attributes { margin-left: 22px; font-size: 90% }
    .attributes p { margin-left: 16px; font-style: italic }
  </style>
  <details>
    <summary>
      <span>
        <code class="name">&lt;<slot name="element-name">NEED NAME</slot>&gt;</code>
        <i class="desc"><slot name="description">NEED DESCRIPTION</slot></i>
      </span>
    </summary>
    <div class="attributes">
      <h4><span>Attributes</span></h4>
      <slot name="attributes"><p>None</p></slot>
    </div>
  </details>
  <hr>
</template>

规范

规范	状态	备注
HTML Living Standard <slot> 的定义	现行的标准	-
DOM Slots 的定义	现行的标准	-

桌面浏览器兼容性

移动浏览器兼容性