Question

这是我的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>

这是我的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>

我试图不使用＆＃39; ... querySelector（＆＃39; link [href $ =＆＃34; component.html＆＃34;]＆＃39;）。import ..＆＃39;我已将其插入评论中。我想引用模板标签而不插入＆＃39; component.html＆＃39;。它没有用，但我不明白为什么。

引用Web组件中的模板标记

0 个答案: