实现广告位随机显示不同图片及链接

PetitQ Other/其他 2019-6-13 1.35K 0 0

很多博客网站上都穿插一些广告位，大多数都是投放一些图片广告获取微薄的输入，很多网站博主是通过投放 gif 格式的动态广告图片，有些直接投放 jpg 或 png 格式图片。但是这种做法只能一个广告位显示一个广告图片和一个链接地址，为了更好的广告点击效果所以就要求客户每个位置提供至少三张图片，那么有没有可能实现一个广告位随机显示不同的图片及链接地址呢？今天就分享给大家，以便大家需要的时候能用上！

```
    var p=3;
```
```
    var q=Math.floor(Math.random()*p+1)
```
```
    switch(q)
```
```
    {
```
```
    case 1:
```

    document.writeln("<a href=http://广告链接地址 target=_blank rel="noopener noreferrer"><img src=http://广告图片地址  border=0></a>");

```
    break;
```
```
    case 2:
```

    document.writeln("<a href=http://广告链接地址 target=_blank rel="noopener noreferrer"><img src=http://广告图片地址  border=0></a>");

```
    break;
```
```
    case 3:
```

    document.writeln("<a href=http://广告链接地址 target=_blank rel="noopener noreferrer"><img src=http://广告图片地址  border=0></a>");

```
    break;
```
```
    }
```

也想出现在这里？联系我们吧

先将上述代码里的“广告链接地址”和“广告图片地址”等修改为自己的链接后，将上述代码另存为 myad.js 文档后，上传至服务器主机指定目录，记下具体的目录地址。在需要引用的地方，只需要加上下面这段引用代码即可：

```
    <center>
```

    <script type="text/javascript" src="https://www.imydl.com/images/myad.js"></script>

```
    </center>
```

其实只要是有点儿 JS 代码常识的都可以看出来，这个代码很简单，但是又很实用。明月提供的这个样例，是可以实现三张图片随机展示。如果想调整这个图片数量，只需要修改 var p=3 这里的数字，然后修改 switch 里面的对应的 case 数量即可。

还可以给广告指定投放有效时段，代码如下：

```
    function strToDate(str,ext){
```

        if(str==null || str=='') return;

```
        var arys = new Array();
```
```
        arys = str.split('-');
```

        var newDate = new Date(arys[0],arys[1]-1,arys[2],9,0,0);

```
        if(ext){
```

            newDate = new Date(newDate.getTime()+1000*60*60*24);

```
        }
```
```
        return newDate;
```
```
    }
```
```
    function showit(str,start,end){
```
```
    var date = new Date();
```
```
    var start=strToDate(start);
```
```
    var end=strToDate(end,false);
```

    if(date>start && date<end || start==null){

```
    document.write(str);
```
```
        }
```
```
    }
```
```
    var p=3;
```
```
    var q=Math.floor(Math.random()*p+1)
```
```
    switch(q)
```
```
    {
```
```
    case 1:
```

    showit("<a href='https://广告链接地址=_blank'><img src='http://广告图片地址'  border=0></a>","2017-3-24","2017-3-25");

```
    break;
```
```
    case 2:
```

    showit("<a href='https://广告链接地址=_blank'><img src='http://广告图片地址'  border=0></a>","2017-3-24","2017-3-25");

```
    break;
```
```
    case 3:
```

    showit("<a href='https://广告链接地址=_blank'><img src='http://广告图片地址'  border=0></a>","2017-3-24","2017-3-25");

```
    break;
```
```
    }
```

至此，我们已经实现了广告位随机显示不同的广告图片及对应的链接地址，大家只能自己调试了，是不是很简单呀？有时候刷新就能看到显示不同的广告图片，因为只放两个图片，虽然说是 50%的概率，但是也不一定每次都能看到不同的图片。最近一直在找类似的 JS 实现的广告代码，如果有更合适的，还会分享给大家的，希望这段代码对大家有帮助。