javascript - 未捕获的 TypeError : tplContent. importNode 不是函数-6ren

javascript - 未捕获的 TypeError : tplContent. importNode 不是函数

转载作者：行者123 更新时间：2023-11-30 14:52:23

我正在阅读“Web Components mit Polymer”一书，并尝试了书中的以下代码:

<!doctype html>
<html>
<body>
<template id="tpl">
    <h1 class="title"></h1>
    <div class="body"></div>
</template>
<script>
    var tplContent = document.getElementById("tpl").content;
    var node = tplContent.importNode(true);
    node.querySelector("h1").textContent = "Hallo Welt";
    node.querySelector("div").textContent = "Ich komme aus einem Template";
    document.body.appendChild(node);
</script>
</body>
</html>

但我只是在第二个 JS 行中停止了错误:

Uncaught TypeError: tplContent.importNode is not a function

我在 Ubuntu 上使用 Google Chrome 版本 63.0.3239.84。有人可以帮我处理这个订单吗？

问候，阿图尔

最佳答案

你这里有错误:

var node = tplContent.importNode(true);

tpl 没有函数 importNode()

如果你想使用importNode :

var node = document.importNode(tplContent, true);

<!doctype html>
<html>
<body>
<template id="tpl">
    <h1 class="title"></h1>
    <div class="body"></div>
</template>
<script>
    var tplContent = document.getElementById("tpl").content;
    var node = document.importNode(tplContent, true);
    node.querySelector("h1").textContent = "Hallo Welt";
    node.querySelector("div").textContent = "Ich komme aus einem Template";
    document.body.appendChild(node);
</script>
</body>
</html>