HTML导入在Chrome中不起作用_Html_Google Chrome_Polymer

HTML导入在Chrome中不起作用

html google-chrome polymer

HTML导入在Chrome中不起作用,html,google-chrome,polymer,Html,Google Chrome,Polymer,据此,，除了最新版本的Chrome（可能是目前唯一支持HTML导入的浏览器）之外，还可以通过Polymer在浏览器上使用HTML导入。但是，以下html改编自同一篇文章： 1.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Basic HTML Imports</title> <!-- P

据此,，除了最新版本的Chrome（可能是目前唯一支持HTML导入的浏览器）之外，还可以通过Polymer在浏览器上使用HTML导入。但是，以下html改编自同一篇文章：

1.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Basic HTML Imports</title>
    <!-- Pull in our blog post example -->
    <link rel="import" href="2.html">

  </head>
<body>
  <p>Hello World!</p>
<script src="platform.js"></script>
<script>
      window.addEventListener('HTMLImportsLoaded', function() {
        var link = document.querySelector('link[rel=import]');
        var content = link.import.querySelector('#test');
        document.body.appendChild(document.importNode(content, true));
      });
    </script>
</body>
</html>

<div id="test">
  <h1>Here is the Import </h1>
</div>


基本HTML导入
你好，世界
addEventListener（'HTMLImportsLoaded'，function（）{
var link=document.querySelector（'link[rel=import]'）；
var content=link.import.querySelector（“#test”）；
document.body.appendChild（document.importNode（content，true））；
});

2.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Basic HTML Imports</title>
    <!-- Pull in our blog post example -->
    <link rel="import" href="2.html">

  </head>
<body>
  <p>Hello World!</p>
<script src="platform.js"></script>
<script>
      window.addEventListener('HTMLImportsLoaded', function() {
        var link = document.querySelector('link[rel=import]');
        var content = link.import.querySelector('#test');
        document.body.appendChild(document.importNode(content, true));
      });
    </script>
</body>
</html>

<div id="test">
  <h1>Here is the Import </h1>
</div>


这是进口货

我得到了那份工作

似乎

已成功导入Firefox，但未导入Chrome。请注意，我尝试在about:flags中启用实验性Web平台功能

有没有办法让它也适用于Chrome？我正在寻找任何解决方案，使我能够使用Firefox和Chrome的最新版本的基本导入。（我的项目要到2016年初才能上线，所以我希望到时候每个平台都能提供标准支持，但在此期间解决方案会很好。）谢谢。

您似乎在使用

文件：

协议，该协议被跨源资源共享策略阻止

从主控文档或导入映射中的文档链接的所有导入必须使用潜在启用CORS的fetch加载，模式设置为“匿名”

您可以尝试在localhost上运行服务器，这会有所帮助。

他们就是这样做的：嗯，请原谅我的评论，因为我通常使用PHP：）刚刚检查过-它确实可以在线工作。我只使用了href=“2.html”，为什么它在本地不起作用？所有文件都在同一个文件夹中。在这一点上，Chrome与Firefox有不同的策略。我不知道具体的理由，但通常是出于安全考虑。同样，如果没有服务器，则不能通过XMLHttpRequest请求资源。还有一点需要澄清：如果我希望导入在Chrome中脱机正确执行，那么语法应该是什么？href=“2.html”在链接到其他页面时工作正常，但在导入情况下失败，这一事实对我来说没有意义。不，你不能。你必须有一个服务器。这是由于浏览器的安全策略造成的

href

在

上工作，它表示导入的URL称为导入位置。若要从其他域加载内容，导入位置需要启用CORS。有关详细信息，请参阅。从主控文档或导入映射中的文档链接的所有导入必须使用可能启用CORS的fetch加载，模式设置为“匿名”。