1

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

在此处输入图像描述

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

或者，取而代之的是，这些元素重复了？

索引.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>

零件.html

<div class="foo">
    <p>Foo</p>
</div>

<div class="bar">
    <p>Bar</p>
</div>
4

1 回答 1

0

我调查了你的场景（做了这个小提琴）；

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

资源像 iframe 一样嵌入在浏览器中（至少这是 chrome 实现使资源可用的方式 -在其他主要浏览器中没有实现）。

所以你仍然有一个 html 元素、一个头部和一个正文，嵌入的资源看起来像一个 iframe，这就是你在开发工具中看到的。

于 2016-04-01T17:19:02.490 回答