无阻塞加载javascript，对于页面性能优化有很大的作用，这样能有效的减少js对页面加载的阻塞。特别是一些广告js文件，由于广告内容有可能是富媒体，更是很可能成为你页面加载提速的瓶颈，高性能javascript告诉我们，同学，提升你的网页速度，就无阻塞地加载JS吧。
于是便有一下代码出现。
|
1
2
3
4
5
6
7
8
|
(function() {
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = true;
s.src = 'http://yourdomain.com/script.js';
var x = document.getElementsByTagName('script')[0];
x.parentNode.insertBefore(s, x);
})();
|
上边都是大家熟悉的，看过书的同学都知道这样无阻塞加载的好处，效果挺不错的，当此等无阻塞脚本遇到一般js广告就来了写问题——广告代码出现在HTML里面了却不显示广告。
纳尼？HTML出来了不渲染到页面上？
先看看广告js代码
复制代码 代码如下:
document.write('<img src="http://img.jb51.net/logo_small.gif" js" id="highlighter_386534">
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
function LoadADScript(url, container, callback){
this.dw = document.write;
this.url = url;
this.containerObj = (typeof container == 'string'?document.getElementById(container):container);
this.callback = callback || function(){};
}
LoadADScript.prototype = {
startLoad: function(){
var script = document.createElement('script'),
_this = this;
if(script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" || script.readyState == "complete"){
script.onreadystatechange = null;
_this.finished();
}
};
}else{ //Other
script.onload = function(){
_this.finished();
};
}
document.write = function(ad){
var html = _this.containerObj.innerHTML;
_this.containerObj.innerHTML = html + ad;
}
script.src = _this.url;
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);
},
finished: function(){
document.write = this.dw;
this.callback.apply();
}
};
|