Question

当我使用HTML导入时，我看到了：

这是否意味着我仍然有一个 html元素，一个 head和一个 {{1 }}？

或者，这些元素有没有重复？

的index.html

body

parts.html

<head>
    <link rel="import" href="parts.html">
</head>
<body>
    <script>
        var link = document.querySelector('link[rel="import"]');
        var content = link.import;
        var el = content.querySelector('.foo');
        document.body.appendChild(el.cloneNode(true));
    </script>
</body>

Answer 1

我调查了你的场景（制作了这个fiddle）;

基本上通过import属性，您可以包含.html文件可以包含的任何内容（允许访问分离的.html源代码），

资源像iframe一样嵌入浏览器中（至少这是chrome实现使资源可用的方式 - not implemented in other major browsers）。

所以你仍然有一个html元素，ONE head和ONE body，嵌入式资源看起来就像一个iframe，这就是你在开发工具中看到的。

<link rel =“import”/>标记内的重复HTML元素

1 个答案: