This my index.html:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
<link rel="import" href="component.html">
</head>
<body>
<tag-name></tag-name>
</body>
</html>
and this is my component.html
<template>
<style></style>
<div>test</div>
</template>
<script>
customElements.define('tag-name', class extends HTMLElement {
constructor() {
super();
/*var tmpl = document.querySelector('link[href$="component.html"]').import
.querySelector('template').content.cloneNode(true);*/
var currentScript = document.currentScript;
var tmpl = currentScript.previousSibling.content.cloneNode(true);
this.attachShadow({
mode: 'open'
}).appendChild(tmpl);
}
});
</script>
I tried to don't use ' ...querySelector('link[href$="component.html"]').import ..' I've inserted it in comment. I wanted to reference to template tag without insert 'component.html'. It doesn't work but I don't understand why.
