Javascript 为什么不是'；当一切正常时，是否执行importNode？_Javascript_Html_Import_Html Imports_Html5 Template

Javascript 为什么不是'；当一切正常时，是否执行importNode？

javascript html import

Javascript 为什么不是'；当一切正常时，是否执行importNode？,javascript,html,import,html-imports,html5-template,Javascript,Html,Import,Html Imports,Html5 Template,我想使用HTML导入，因此创建了两个文件。文件1： div{ 高度：300px；宽度：300px；背景颜色：黄色； } 文件2： <!DOCTYPE html> <html> <head> <link rel='import' href='test.html' id='LINK'> <script> var LINK = document.getElementById('LINK');

我想使用HTML导入，因此创建了两个文件。
文件1：


div{
高度：300px；
宽度：300px；
背景颜色：黄色；
}

文件2：

<!DOCTYPE html>
<html>
<head>
    <link rel='import' href='test.html' id='LINK'>
    <script>
        var LINK = document.getElementById('LINK');
        var test = LINK.import;
        var content = document.importNode(test.content, true);
        document.body.appendChild(content);

    </script>
</head>
<body>        
</body>
</html>


var LINK=document.getElementById（'LINK'）；
var测试=LINK.import；
var content=document.importNode（test.content，true）；
document.body.appendChild（content）；

当我执行File2时，我应该看到一个黄色的方块，但是我得到了以下错误：

Uncaught TypeError:未能对“文档”执行“导入节点”：参数1不是“节点”类型。
在Import.html:8

当我将“test”变量记录到控制台时，我得到的是包含File1的文档，因此它在那里很好。我只是不明白错误的含义以及它不起作用的原因。

当你写：

var content = document.importNode(test.content, true);

…您假设

test

是一个

元素

因此，在您导入的文档中，应该有一个

元素

test.html：

您使用的

import

不正确。您应该导入一个网页的“片段”，而不是整个网页。@ScottMarcus那么我该怎么做呢？我使用的是我从一个教程中找到的代码。

var content = document.importNode(test.content, true);

<html>
<head>
    <style>
        div {
            height: 300px;
            width: 300px;
            background-color: yellow;
        }
    </style>
</head>
<body>
    <template><div></div></template>
</body>
</html>

var LINK = document.getElementById('LINK');
var test = LINK.import.querySelector('template');
var content = document.importNode(test.content, true);
...