素のJavascriptでWebComponentsを使う時、templeteタグをquerySelectorする方法
github pagesでエラーが出るページを再現致しました。devtoolでどこでエラーが出ているかご確認いただけます。
https://fushihara.github.io/webcomponents-question-20171206/
HTMLElementを継承したXTestというクラスを定義し、クラスXTestをx-testという名前のカスタムタグとして登録しました。
XTestクラスの中で、カスタムタグの中身を作る時にtemplateタグを取得しcloneNodeしようと思ったのですが、document.currentScript
がnullになってしまいownerDocumentを取得する事が出来ませんでした。
XTextクラスの中でteplateタグを取る方法を教えて欲しいです。
サンプルコードの構造としては、重要なファイルは以下の3件。
/index.html /web-component/custom-element.html /web-component/custom-element.js
index.htmlでは以下の2行を書くだけでコンポーネントが使える。
インポート先のパス(この場合はweb-componentというディレクトリ名)が変わっても、cutstom-element.html jsファイルの挙動には影響が無いようにしたいので、index.htmlの中のscriptタグで何かをする という対応策は避けたいです。
<link rel="import" href="./web-component/custom-element.html"> <x-test id="a"></x-test>
custom-element.js もしくは custom-element.htmlだけの修正で、どこにもっていっても動くコンポーネントを作りたいです。
全ファイルの中身はgithubで公開しております。
インデックスとインデックスのjs、web componentのhtml とjsの4ファイルx2セットの差分です
https://github.com/fushihara/webcomponents-question-20171206
回答2件
あなたの回答
tips
プレビュー