欢迎来到 54818模板网!这是一个yzmcms的模板分享站。

用原始js动态加载js文件或css文件

相关案例演示

        为了做一个分享代码需要在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和之后的代码同时进行的话,没办法获取到参数。。

    作者:54818模板网 关注:444 时间:2022-02-10 13:05:22
    相关网站教程