<slot>: The HTML Slot Element

1 Description

The HTML <slot> element exists to act as a named placeholder in a <template> element which will be replaced by other elements via JavaScript. elements should have a 'name' attribute, the value of the 'name' attribute may be any string.

See Also

The <template> element.

2 Examples

<!DOCTYPE html>
<html>
    <head>
        <title>Template Example Page</title>
    </head>
    <body>
        <h1>News Articles</h1>
        <h2>May 22, 2025</h2>
        <template>
            <article>
                <h3>
                    <slot name="article_title"></slot>
                </h3>
                <small>
                    <p>
                        <slot name="article_author"></slot>
                    </p>
                </small>
                <p>
                    <slot name="article_content"></slot>
                </p>
            </article>
        </template>
    </body>
</html>

This document was last updated: