1、加载在头部
1
2
3
|
var js = document.createElement( 'script' ); js.src = 'myscript.js' ; document.getElementsByTagName( 'head' )[0].appendChild(js); |
另一种写法是:
1
2
3
|
var js = document.createElement( 'script' ); js.src = 'myscript.js' ; document.head.appendChild(js); |
2、加载在BODY中
加载在页面中的写法如下:
1
2
3
|
var js = document.createElement( 'script' ); js.src = 'myscript.js' ; document.body.appendChild(js); |
这种加载方法存在一个问题,就是有可能代码是在head区域,导致body还没达到,document.body就不存在,代码就会出错。
3、使用documentElement
document.documentElement就是html文档本身,因此肯定是存在的,这种调用的写法如下:
1
2
3
4
|
var js = document.createElement( 'script' ); js.src = 'myscript.js' ; var html = document.documentElement; html.insertBefore(js, html.firstChild); |
4、加载在第一个脚本前
这种方法是把js文件插入到第一个出现script的标识前,除非网页里没有任何一个script出现,否则应该不会出错。代码的写法如下:
1
2
3
4
|
var js = document.createElement( 'script' ); js.src = 'myscript.js' ; var first = document.getElementsByTagName( 'script' )[0]; first.parentNode.insertBefore(js, first); |
5、加载在当前JS文件之前或之后
这种方法是把js文件插入到目前所在的js文件前,代码的写法如下:
1
2
3
4
5
|
var js = document.createElement( 'script' ); js.src = 'myscript.js' ; var first = document.getElementsByTagName( 'script' ); var here = first[first.length-1]; here.parentNode.insertBefore(js,here); |
加载在当前js文件之后,代码的写法如下:
1
2
3
4
5
|
var js = document.createElement( 'script' ); js.src = 'myscript.js' ; var first = document.getElementsByTagName( 'script' ); var here = first[first.length-1]; here.parentNode.appendChild(js); |
附录:1、在JS文件里加载CSS文件
1
2
3
4
5
|
var link = document.createElement( 'link' ); link.setAttribute( 'type' , 'text/css' ); link.setAttribute( 'rel' , 'stylesheet' ); link.setAttribute( 'href' , 'mycss.css' ); document.head.appendChild(link); |
附录:2、在JS文件里设置META
1
2
3
4
|
var meta = document.createElement( 'meta' ); meta.setAttribute( 'name' , 'viewport' ); meta.setAttribute( 'content' , 'width=device-width, initial-scale=1' ); document.head.appendChild(meta); |
© 版权声明
文章版权归作者所有,未经允许请勿转载。