data include replace

data-include-replace

Applies to: elements with data-include

When present, the including element is replaced by the included content rather than having the content inserted inside it.

Usage

<div data-include="intro-section.html"
     data-include-replace="true">
  <!-- This entire <div>, including its opening and closing tags,
       is replaced by the included file's content -->
</div>

Compared to default behavior

<section data-include="content.html">
  <!-- content.html's markup is placed here, inside the <section> -->
</section>

<section data-include="full-section.html"
         data-include-replace="true">
  <!-- The <section> element itself is replaced by full-section.html's content -->
</section>

Notes

• Use when the included file provides its own wrapper element (e.g., the file is a full <section>)
• Without data-include-replace, you'd end up with nested <section> elements
• Any value for the attribute triggers replacement ("true", "1", or just the presence of the attribute)