この記事では、主にHTMLでのファイルインポートの簡単な紹介を紹介します。
テンプレート、Shadow DOM、およびカスタム要素により、以前よりもUIコンポーネントを簡単に作成できます。ただし、HTML、CSS、JavaScriptなどのリソースを1つずつロードする必要がありますが、これは非常に非効率的です。
重複する依存関係を削除するのは簡単ではありません。たとえば、JQuery UIまたはBootstrapをロードするには、JavaScript、CSS、およびWebフォントに個別のタグを追加する必要があります。 Webコンポーネントが複数の依存関係を適用すると、事態はより複雑になります。
HTMLインポートを使用すると、これらのリソースをマージしたHTMLファイルにロードできます。
HTMLを使用してインポートします
HTMLファイルをロードするには、REL属性がインポートされるリンクタグを追加する必要があり、HERF属性はHTMLファイルへのパスです。たとえば、component.htmlをindex.htmlにロードする場合:
index.html
XML/HTMLコードコピーコンテンツにクリップボードに