您好,欢迎访问一九零五行业门户网

Javascript 实现广告后加载 可加载百度谷歌联盟广告[原创]_javascript技巧

本文主要介绍一种新的广告后加载的方式,支持自定义html广告、百度联盟广告和谷歌联盟广告。这种方式在页面加载完成后执行,不影响内容的显示,对用户更加友好。
我们在网站上放置广告,最简单的方法就是把js代码,插入指定的位置,这样带了后果就是,页面按照顺序加载,偶尔一条广告代码卡住,整个页面都会卡住,给用户带来的体验是极差的。
那么怎么解决这种问题呢?先说一下原理,在我们的页面上先预留一些占位符,为了不影响页面内容的加载,我们在页面的底部引入js处理,逐个把占位符替换成相应的广告。
下面我们看具体的实现步骤:
一、在页面上放置占位符,其实就是一个span标记
复制代码 代码如下:
二、编写独立的js脚本代码:jbloader.js
复制代码 代码如下:
jbmap = window.jbmap || {};
function jbviajs(locationid) {
    var _f = undefined;
    var _fconv = 'jbmap[\' + locationid + '\]';
    try {
        _f = eval(_fconv);
        if (_f != undefined) {
            _f()
        }
    } catch(e) {}
}
function jbloader(closetag) {
    var jbtest = null,
    jbtestpos = document.getelementsbytagname(span);
    for (var i = 0; i         if (jbtestpos[i].classname == jbtestpos) {
            jbtest = jbtestpos[i];
            break
        }
    }
    if (jbtest == null) return;
    if (!closetag) {
        document.write();
        jbviajs(jbtest.id);
        return
    }
    document.write();
    var real = document.getelementbyid(jbtestpos_ + jbtest.id);
    for (var i = 0; i         var node = real.childnodes[i];
        if (node.tagname == script && /closetag/.test(node.classname)) continue;
        jbtest.parentnode.insertbefore(node, jbtest);
        i--
    }
    jbtest.parentnode.removechild(jbtest);
    real.parentnode.removechild(real)
}
jbmap['ads_one'] = function() {
 document.writeln('脚本之家');
};
jbmap['ads_two'] = function() {
 document.writeln('var cpro_id = u336546;'+'ipt>');
};
jbmap['ads_three'] = function() {
 document.writeln(''+'pt>http://www.jb51.net>(adsbygoogle = window.adsbygoogle || []).push({});'+'cript>');
};
注意:jbmap是放置广告的数组,数组的key和span标记的id是对应的,我们可以在这个js中按照这种形式添加自己的广告。这种广告加载方式,支持自定义的html广告、百度联盟广告、谷歌联盟广告,这里都给大家做了演示。
三、在页面底部中引入js,调用jbloader加载广告
复制代码 代码如下:
注意:格式必须是如上这种格式,有几个占位符,就添加几个
不要问小编为什么要这样调用,其实小编也研究了一下:
1.第一次jbloader()是为了写标记,第二次jbloader(true)是为了替换标记。
2.用两个
总之:好多大网站都在使用这种方法,大家放心用好了。至此,就完成了页面广告后加载的调用。
其它类似信息

推荐信息