谷歌浏览器可以正常使用,但是在谷歌吧浏览器之外使用link的import引入的页面就无法显示
那么这个问题该如何解决呢?
首先引入肯定在jq实现了load(需要加载的文档地方),此时在这个js文件下方进行需要请求的js代码使用$.getScripr('需要加载模板运行的js')
第一步工作这一已经结束了,第二部呢,需要将这个加载的js引入到需要加载的页面使用JavaScript引入,
此时有个先后顺序,这个时候由于第一步时候的js是根据jquery写的,因此在引入第一步时的脚本文件前,先引入一个jquery!
此时在谷歌,火狐,IE(9级以上)包含win10自带的edge均正常使用!
引入到页面后,进行模块的样式文件导入到页面就完全ok了!
说了这么多肯定不太明白,附上三个步骤的主要核心代码
第一步:引入加载的模块,以及模块依赖的js脚本文件导入
$(function(){
$('#header').load('index.html nav');
$('#footer').load('index.html footer');
$.getScript('bs/js/bootstrap.js')
})
第二步:进行引入页面的头部内容,引入jq在引入第一步的脚本,以及css(css文件没有明确位置,在js之上之下都完全ok的)
<meta charset="UTF-8">
<link rel="stylesheet" href="bs/css/bootstrap.css" />
<link rel="stylesheet" href="css/index.css" />
<script src="jquery-1.11.3.js"></script>
<script src="js/test2.js"></script>
第三步:在第一部的js文件请求index.html页面的nav部分代码加载在本页的#header内,所以本页要先写#header这个DOM,jquery才能操作(否则是不显示的)!
<nav id="header"></nav>
其实关于这个import在使用时候,谷歌浏览器会提示这个即将停止使用,如果单纯引入静态页面使用
<link rel="import" href="需要加载的页面">
优点无需导入模板区域的样式,缺点模板区域的js无法使用!
两种方法根据自己的效果选取,目前关于import的问题完美搞定