第一步：html文件
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<!--<script src="countDown.js"></script>-->
<title>countDown倒计时</title>
</head>
<body>
<script>
addEvent(window,'load',function(){
dateH.init('en');//传en是英文
function each(elem, date) {
for (var i = 0; i < elem.length; i++) {
elem[i].innerHTML = date;
}
}
each(dateH.$c('updateHaleyYear'), dateH.year);
each(dateH.$c('updateHaleyDay1'), dateH.day1);
each(dateH.$c('updateHaleyMonth'), dateH.month);
each(dateH.$c('updateHaleyDay2'), dateH.day2);
each(dateH.$c('updateHaleyNumber'), dateH.number);
});
function addEvent(elm, evType, fn, useCapture) {
if (elm.addEventListener) {
elm.addEventListener(evType, fn, useCapture);//DOM2.0
return true;
}
else if (elm.attachEvent) {
var r = elm.attachEvent('on' + evType, fn);//IE5+
return r;
}
else {
elm['on' + evType] = fn;//DOM 0
}
}
</script>
<p>活动开始年份：<span class="updateHaleyYear"></span></p>
<p>活动开始日：<span class="updateHaleyDay1"></span></p>
<p>结束月：<span class="updateHaleyMonth"></span></p>
<p>活动结束日<span class="updateHaleyDay2"></span></p>
<p>第<span class="updateHaleyNumber"></span>届</p>
<p>倒计时：<span id="daojishi"></span></p></body>
</html>
第二步：新建txt文件，命名为countDown.js
/* 倒计时js */
var dateH={
interval : 1000,
year:2017,/*** 这里修改换届时间 by haley *****/
month:9,
day1: 21,
day2: 24,
number: 19,
info:{
cn:["本届展会已过期 <br/>敬请期待下期展会","距离展会开幕<br>还有" ,"天"],
en:["本届展会已过期 <br/>敬请期待下期展会","距离展会开幕<br>还有","days"]
},
timer:null,
init:function(lang){
this.timer =setInterval(function(){this.showCountDown('daojishi',lang);}.bind(this), this.interval);
},
showCountDown:function(elem,lang) {
var year=this.year||2016;
var month=this.month||9;
var day=this.day1 ||25;
var cc = document.getElementById(elem);
var now = new Date();
var endDate = new Date(year, month - 1, day);
var leftTime = endDate.getTime() - now.getTime();
var leftSecond = parseInt(leftTime / 1000);
var days = Math.floor(leftSecond / (60 * 60 * 24));
var dayHtml = "";
var info=[];
if(lang=='en'){
info[0]=this.info.en[0];
info[1]=this.info.en[1];
info[2]=this.info.en[2];
}else{
info[0]=this.info.cn[0];
info[1]=this.info.cn[1];
info[2]=this.info.cn[2];
}
if (days < 0) {
clearInterval(this.timer);
cc.innerHTML = "<span style='line-height:1.5em;text-align:center;'></span>";
} else {
days = days < 10 ? "0" + days:days;
dayHtml = "<span style='font-weight:bold;font-size:1.5em;'> " + days + " </span>";
cc.innerHTML = info[1]+ dayHtml + info[2];
}
},
$c:function(elem) {
return document.getElementsByClassName(elem);
}
};
if (!Function.prototype.bind) {
Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
// closest thing possible to the ECMAScript 5 internal IsCallable function
throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
}
var aArgs = Array.prototype.slice.call(arguments, 1),
fToBind = this,
fNOP = function () {},
fBound = function () {
return fToBind.apply(this instanceof fNOP && oThis
? this
: oThis,
aArgs.concat(Array.prototype.slice.call(arguments)));
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}
注：两个文件放在同一目录，如果路径不同，请自行修改。