为了做一个分享代码需要在JS中动态加载JS和CSS文件。所以找了一些资料,并记录了一些心得。
//动态加载CSS文件 function LoadCss(c,id) { var a = document.getElementById(id); var b = document.getElementsByTagName("head").item(0); if(a) { b.removeChild(a) } css = document.createElement("link"); css.href = c; css.rel = "stylesheet"; css.type = "text/css"; css.id = id; b.appendChild(css) } //调用方法 LoadCss(css的文件路径,要生成的ID名);
//动态加载JS文件 function LoadJs(url,id,callback){ var a = document.getElementById(id); var b = document.getElementsByTagName("head").item(0); if (a) { b.removeChild(a) } var js=document.createElement('script'); js.type='text/javascript'; js.async='async'; js.src=url; js.id = id; b.appendChild(js); if(js.readyState){ //IE js.onreadystatechange=function(){ if(js.readyState=='complete'||js.readyState=='loaded'){ js.onreadystatechange=null; callback(); } } }else{ //非IE js.onload=function(){callback();} } } //调用方法 LoadJs(js文件路径,要生成的ID名,加载完成之后的回调函数);
回调函数就是加载完成JS之后,第一时间运行的代码。之所以有回调函数,是要确保加载完成JS,否则的话,不知道有没有加载完成js,加载JS和之后的代码同时进行的话,没办法获取到参数。。