| 标题：js动态加载css与js |
发帖时间：2017-10-15 08:37:20 |
乌托
一. jquery加载js与css
1.加载js
$.getScript("./test.js"); //加载js文件
$.getScript("./test.js",function(){ //加载test.js,成功后，并执行回调函数
console.log("加载js文件");
});
2.加载css
$("<link>").attr({ rel: "stylesheet",type: "text/css",href: "site.css"}).appendTo("head");
二.jacascript加载js与css
function loadJs(url,callback){
var script=document.createElement("script");
script.type="text/javascript";
if(typeof(callback)!="undefined"){
if(script.readyState){
script.onreadystatechange=function(){
if(script.readyState == "loaded" || script.readyState == "complete"){
script.onreadystatechange=null;
callback();
}
}
}else{
script.onload=function(){
callback();
}
}
}
script.src=url;
document.body.appendChild(script);
}
loadJs("test.js",function(){
alert("done");
});
//加载css的原理相同，只不过插入的的父节点是head标签。
三、动态改变现有属性
动态改变已有script的src属性
<script src=""1.js"id="s1"></script>
<script language="javascript">
s1.src="test.js"
</script>
