动态加载js,css(项目中需要的)

Posted 胖娘子_bug

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了动态加载js,css(项目中需要的)相关的知识,希望对你有一定的参考价值。

最近做的一个项目需要加入百度统计,大家都知道百度统计在页面引用就是一坨js,实现方法很简单引用到页面就ok了。

那么问题来了,虽然我不知道百度统计的原理是啥,我的测试服引用了百度统计,百度统计账号里面配置的域名是正式服的域名,但是却检测到了我测试服的访问量,这就尴尬了,然后就想到了动态加载js

1.动态加载js文件

我们要把这块链接加入页面

<script src="js/count.js"></script>

具体代码实现如下

function loadJs(url){
	var script = document.createElement("script");
	script.type="text/javascript";
	script.src=url;
	document.body.appendChild(script);
}
//调用loadJs
loadJs("js/count.js");//这儿的参数是你的js的地址

2.动态加载js脚本

 

function loadJscode(code){
	  var script = document.createElement("script");
	  script.type = "text/javascript";
	   try{
		script.appendChild(document.createTextNode(code));
	   }catch(e){
		script.text = code;
	   }
	       document.body.appendChild(script);
}
    var text = "function test(){alert(‘test‘);}";
    loadJscode(text);

3.动态加载css文件

我们要把这块链接加入页面

 

<link rel="stylesheet" href="css/count.css" />

 

具体代码实现如下

function loadCss(url){
	  var css = document.createElement("link");
	  css.type = "text/css";
	  css.href = url;
	  document.body.appendChild(script);
}
//调用loadCss
loadJs("css/count.css");//这儿的参数是你的css的地址

4.动态加载css脚本

  

		function loadCsscode(cssCode){
				var style = document.createElement("style");
				style.type = "text/css";
				try{
					// firefox、safari、chrome和Opera
					style.appendChild(document.createTextNode(cssCode));//createTextNode创建文本节点
				}catch(e){
					//老版本的IE浏览器 ,需要使用style元素的stylesheet属性的cssText属性
					style.styleSheet.cssText = cssCode;
				}
				document.getElementsByTagName("head")[0].appendChild(style);
		}
		 var text = "font{color:#000;}";
		 loadCsscode(text);

  借鉴于袁客

 

  


以上是关于动态加载js,css(项目中需要的)的主要内容,如果未能解决你的问题,请参考以下文章

动态加载jscss 代码

动态加载jscss 代码

动态加载js和css

#iOS问题记录#动态Html加载本地CSS和JS文件

动态添加div及对应的jscss文件

动态加载js css 插件