<slot>

HTML-элемент <slot> является частью набора технологии Web Components, является заполнителем внутри веб компонента, который можно заполнить собственной разметкой, которая позволяет создавать отдельные деревья DOM и представлять их вместе.

Категории контента (en-US)	Поток контента (en-US), содержание формулировки (en-US)
Разрешённый контент	Прозрачный (en-US)
События	`slotchange`
Пропуск тега	Нет, открывающий и закрывающий теги обязательны.
Разрешённый родители	Любой элемент, который принимает содержание формулировки (en-US)
Разрешённые роли ARIA	Никакой
Интерфейс DOM	`HTMLSlotElement` (en-US)

Атрибуты

Этот элемент включает в себя глобальные атрибуты.

name: Название слота.Именованный слот это элемент <slot> с атрибутом name.

Примеры

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

Примечание: вы можете увидеть этот полный пример в действии на странице element-details (смотрите его в режиме реального времени). Кроме того, вы можете найти в разделе Использование шаблонов и слотов (en-US).

Спецификации

Specification
HTML Standard # the-slot-element
DOM Standard # shadow-tree-slots

Поддержка браузерами

BCD tables only load in the browser