Элемент: свойство slot

Свойство slot интерфейса Element возвращает имя слота в тени DOM, в котором вставлен элемент.

Слот — это заполнитель внутри веб-компонента, который пользователь может заполнить собственным разметкой (см. Использование шаблонов и слотов для получения дополнительной информации).

Строка.

В нашем примере simple-template (посмотреть вживую) мы создаём пример тривиального пользовательского элемента, называемого <my-paragraph>, в котором прикрепляется теневой корень, а затем заполняется содержимым шаблона, содержащего слот с именем my-text.

Когда <my-paragraph> используется в документе, слот заполняется элементом, предназначенным для слотов, путём включения его внутри элемента с помощью атрибута slot со значением my-text. Вот один из таких примеров:

<my-paragraph>
  <span slot="my-text">Let's have some different text!</span>
</my-paragraph>

В нашем файле JavaScript мы получаем ссылку на <span>, показанный выше, затем выводим в консоль ссылку на имя соответствующего элемента <slot>.

let slottedSpan = document.querySelector("my-paragraph span");
console.log(slottedSpan.slot); // logs 'my-text'