包含外部 HTML 的 JavaScript 在 Chrome 中有效,但在 Internet Explorer 和 Firefox 中无效

标签 javascript html include html-imports

我用来导入外部 HTML 的脚本,该脚本具有基于 Bootstrap 的导航栏,这是 Javascript:

<script type="text/javascript">
var link = document.querySelector('link[rel="import"]');

// Clone the <template> in the import.
var template = link.import.querySelector('template');

var clone = document.importNode(template.content, true);

document.querySelector('#navBar').appendChild(clone);

</script>

在我的 HTML 页面中,我所做的就是在部分中包含对外部 html 文件的引用,并在我的部分中添加一个具有定义的类名的 div,如下所示:

<!— link of external HTML file in <HEAD> section -->
<link rel="import" href="navbar.html">

<!— Div with defined class name “navBar”in <BODY> section -->
<div id="navBar"></div>

最佳答案

HTML5?互联网爆炸者?
https://caniuse.com/#feat=imports

不。

可以使用这样的填充:
https://github.com/webcomponents/html-imports

关于包含外部 HTML 的 JavaScript 在 Chrome 中有效,但在 Internet Explorer 和 Firefox 中无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49352173/

相关文章:

javascript - 从嵌套数组中获取 json 数据

javascript - 进度条不会使用 jQuery 增加其大小

html - 简单的单页应用程序模板 Bootstrap

cuda - 如何将内核代码保存在主 .cpp 之外的单独 .cu 文件中?

javascript - 使用 jQuery 从 HTML 解析时间数据

javascript - 是否可以在 title 属性中放置链接?

javascript - 使用 matchesQuery 并包含两次 parse.com javascript

html - 奇怪的 HTML 错误(停止包含 CSS 和 JS 文件)

javascript - JS support() 在 html 中显示标签

html - 导航栏没有出现在我的页面顶部,出现在奇怪的地方