异步动态加载js与css文件的js代码

2019-12-24,,,

jquery动态加载css,js文件方法简单很,



方法1:


代码如下
复制代码 代码如下:
$.getscript("test.js");


方法2:


代码如下
复制代码 代码如下:
function loadjs(file){


var head = $('head').remove('#loadscript');


$("<scri"+"pt>"+"</scr"+"ipt>").attr({src:file,type:'text/javascript',id:'load'}).appendto(head);


}



方法3:


代码如下
复制代码 代码如下:
$("<scri"+"pt>"+"</scr"+"ipt>").attr({src:file,type:'text/javascript',id:'load'}).appendto($('head').remove('#loadscript'));

 


下面附一些js动态加载js,css文件的方法。


以下代码是摘自news.qq.com页面里的代码的,本人未进行测试,程序看着应该没有问题的,可以做为参考的,主要用来在网页底部位置,实现动态加载js文件到网页<head>标签的后面,通过DOM来实现的,代码如下:


代码如下
复制代码 代码如下:
<script>
var SCRIPT_TIMEOUT = 20000;
var QVPL_PATH = "/QVPL1.0.0.js";


function loadHelper (jsurl) {
var oScriptEl, oTimeoutHDL, oHead;
oScriptEl = document.createElement("script");
oScriptEl.type = "text/javascript";
oScriptEl.language = "javascript";
oScriptEl.src = jsurl;
oScriptEl.onreadystatechange = doCallback;


oScriptEl.onload = function()
{
this.readyState = "complete";
doCallback();
if(typeof(lianbo) == "object"){
lianbo.init(window.QVPL);
}
};


oTimeoutHDL = window.setTimeout(doError,SCRIPT_TIMEOUT);
document.getElementsByTagName("head")[0].appendChild(oScriptEl);


function doCallback()
{
if (oScriptEl.readyState == "complete" || oScriptEl.readyState == "loaded")
{
oScriptEl.onload = oScriptEl.onreadystatechange = new Function();
window.clearTimeout(oTimeoutHDL);
}
};


function doError()
{
oScriptEl.parentNode.removeChild(oScriptEl);
};
}


loadHelper(QVPL_PATH);
</script>

您可能感兴趣的文章:

  • 动态加载JS文件的三种方法
  • JS 动态加载js文件和css文件 同步/异步的两种简单方式
  • javascript 文件的同步加载与异步加载实现原理
  • 动态加载js的几种方法
  • 同步异步动态引入js文件的几种方法总结

《异步动态加载js与css文件的js代码.doc》

下载本文的Word格式文档,以方便收藏与打印。