Is HTML Import still supported in Google Chrome?

心不动则不痛 提交于 2020-03-01 18:53:08

问题


According to http://blog.teamtreehouse.com/introduction-html-imports

To enable HTML imports in Chrome, go to chrome://flags and enable the Enable HTML Imports flag. Once you’re done, click the Relaunch Now button at the bottom of the screen to restart Chrome with support for HTML imports.

But I can't find it in latest version of Google Chrome flags


回答1:


HTML Imports are implemented natively in Chrome, Opera and Android.

It is still a W3C Working Draft.

For other browsers, you can use:

  • the webcomponentsjs polyfill,
  • or directly the file html-imports.min.js from HTML Imports.

Update 2019

HTML Imports won't be supported natively after Chrome 73. You should then use another solutions:

  • the polyfill,
  • an alternate module loader,
  • JS import combined with template literals,
  • a direct download with fetch().



回答2:


I found an alternate way to do the same. I put the whole file to be imported,in a string, then call document.write(theString) .for example

//head.js
var s= 
`<meta charset='UTF-8'>
<link rel="stylesheet" href="/Program/assets/css/main.css">
<script src="/Program/assets/js/my.js"></script>
<script src="/Program/libs/highlight/highlight.pack.js"></script>
<link rel='stylesheet' href='/Program/libs/highlight/androidstudio2.css'>
<script src='/Program/assets/js/jquery.3.4.1.js' ></script>
<script>
$('code').each(function() {
   var that = $(this);
   var html = that.html().trim();
   that.empty();
   that.text(html);
 });
 hljs.initHighlightingOnLoad();
</script>
`;

document.write(s);

then I call this newly created script file instead of the main file:

 <script src="/Program/head.js"></script>


来源:https://stackoverflow.com/questions/34408880/is-html-import-still-supported-in-google-chrome

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!