happy

はじめに

WebComponentsで紹介した内容のJavaScript版です。
カスタムタグとシャドウDOMは使用しますが、HTMLインポートとtemplateタグは使用しません

HTMLインポートが標準化されるか微妙なので、それをJSモジュールで補うパターンです

呼び出し側

コンポーネントを貼り付けたい場所にカスタムタグを書きます。

カスタムタグ

JavaScriptファイルをモジュールとして読み込みます。CORS制限があります

JavaScriptインポート

呼び出し側での作業は以上です。

呼び出される側

x-tag.js

子コンポーネントを使う場合はimport '子ファイルのパス';を加えてください

happy.js

happy.jsのソースコードです

happy.js