<svelte:element>

<svelte:element this={expression} />

<svelte:element> 要素を使用すると、作成時点で不明な要素（CMS から取得される場合など）を描画できます。存在する任意のプロパティとイベントリスナーがその要素に適用されます。

Svelte の組み込みバインディングは汎用要素では機能しないため、唯一サポートされるバインディングは bind:this です。

this が null 値の場合、要素とその子はレンダリングされません。

this が void 要素 の名前 (例: br) で、<svelte:element> に子要素がある場合、開発モードでランタイムエラーが発生します

<script>
	let tag = $state('hr');
</script>

<svelte:element this={tag}>
	This text cannot appear inside an hr element
</svelte:element>

Svelte は、要素の周囲から適切な名前空間を推測するよう最善を尽くしますが、常に可能なわけではありません。xmlns 属性を使用して、明示できます

<svelte:element this={tag} xmlns="http://www.w3.org/2000/svg" />

this は、有効な DOM 要素タグである必要があります。#text や svelte:head などの要素は機能しません。