异步加载广告,统计JS代码,回提高网站性能
日期：2014-05-16 浏览次数：20364 次
异步加载广告,统计JS代码,来提高网站性能
外部JS的阻塞下载
通常javaScript文件的加载会占用网页中其他元素的下载资源，在一些特别追求Web应用响应速度而且JavaScript文件并不那么小的时候，可以考虑使用异步加载JavaScript的方法来避免影响正常内容的加载进程
??? 有人会问：为什么JS不能像css、image一样并行下载了？这里就不介绍了,有兴趣的同学可以去查看下这篇文章高性能web开发 - 如何加载JS，JS应该放在什么位置？
异步加载的思路很简单：
- 创建一个script的DOM节点；
- 对其的type属性赋值为text/javascript；
- 再指定它的src属性为要加载的js文件URL；
- 把这个DOM节点加入到页面中。
方法一:
function include_js(path,reload)
{
var scripts = document.getElementsByTagName("script");
if (!reload)
for (var i=0;i<scripts.length;i++)
if (scripts[i].src && scripts[i].src.toLowerCase() == path.toLowerCase() ) return;
var sobj = document.createElement('script');
sobj.type = "text/javascript";
sobj.src = path;
var headobj = document.getElementsByTagName('head')[0];
headobj.appendChild(sobj);
}
?
本函数可以用于一些广告和统计的js文件异步加载，避免了因加载js文件而造成的网页显示速度慢的问题。
但是这样当加载的js文件含有document.write语句时,在IE下没有反应，但在Mozilla Firefox 下就会让你原来的网页消失，只显示document.write出来的内容.对此问题一网友给出了一种比较好的解决办法,当然是重写document.write方法:
有一个可以让document.write信息显示出来的方法：
先在网页中需要显示write出来的内容的地方加入一个div标签：
但是这样当加载的js文件含有document.write语句时,在IE下没有反应，但在Mozilla Firefox 下就会让你原来的网页消失，只显示document.write出来的内容.对此问题一网友给出了一种比较好的解决办法,当然是重写document.write方法:
有一个可以让document.write信息显示出来的方法：
先在网页中需要显示write出来的内容的地方加入一个div标签：
1 |
<div id='jsdiv'></div>
|
然后在include_js之前加上这句：
document.write = function (s)
{
document.getElementById('jsdiv').innerHTML+=s;
return false;
}
?方法二：
function loadScript(url, callback){
var script = document.createElement("script")
script.type = "text/javascript";
if (script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" ||
script.readyState == "complete"){
script.onreadystatechange = null;
callback();
}
};
} else { //Others: Firefox, Safari, Chrome, and Opera
script.onload = function(){
callback();
};
}
script.src = url;
document.body.appendChild(script);
}
?使用时，只要简单地传递JavaScript文件的URL和回调函数即可：
?
方法三可以跨域加载JS文件:
01 |
var MiniSite=new Object();
|
|
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
|
