如何在页面中异步加载css/js，写出对应的loadcss，loadjs function

 我来答

1个回答

#热议# 为什么有人显老，有人显年轻？

黑马程序员
2016-09-22 · 改变中国IT教育，我们正在行动

黑马程序员

黑马程序员为大学毕业后，有理想、有梦想，想从事IT行业的年轻人改变自己的命运。黑马程序员成就IT黑马

向TA提问

关注

展开全部

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>

本回答由提问者推荐

已赞过 已踩过<

评论收起

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

如何在页面中异步加载css/js，写出对应的loadcss，loadjs function

其他类似问题

为你推荐：