×

原生JS应用:根据当天不同时间显示不同广告的代码

作者:qing20202023.02.10来源:Web前端之家浏览:2107评论:0
关键词:js

原生JS应用:根据当天不同时间显示不同广告的代码。

在逛一些商城类网站我们会发现很多商品秒杀广告多少时间会自动切换下一个,想实现这种效果我们可以用js判断当天时间段来显示不同广告。

var h = new Date().getHours();
var t = "";
if(h >= 6 && h <= 12){
        t = "广告1";        
}else if(h >= 14 && h <= 20){
        t = "广告2";
}
  else if(h >= 21 || h <= 6){
        t = "广告3";
  }
document.getElementById('time_ads').innerHTML = t;

PS:当天上午6点到12点显示广告1,下午14点到20点显示广告2,晚上19点到次日6点显示广告3

代码二

<script type="text/javascript">
var h = new Date().getHours();
var t = "";
if(h >= 7 && h <= 13){
        t = "<div class='inde_t_ad'><a href='http://www.moyublog.com/' target='_blank' rel='nofollow'><img src='/skin/add/a1.jpg' border='0' /></a></div>";        
}else if(h >= 14 && h <= 20){
        t = "广告2";
}
  else if(h >= 21 || h <= 6){
        t = "广告3";
  }
document.getElementById('time_ads').innerHTML = t;
</script>

广告代码分时段显示
早7点到13点显示广告1
14点到20点显示广告2
19点到次日6点显示广告3

测试时可以调整电脑时间。

OK,差不多了,大家可以去试试吧。

您的支持是我们创作的动力!
温馨提示:本文作者系 ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://jiangweishan.com/article/js20230210a1.html

网友评论文明上网理性发言 已有0人参与

发表评论: