本文介绍轻量级JavaScript倒计时工具CountDown.js。该插件支持按秒数、起止日期或日期加时间三种模式创建倒计时，并提供暂停、恢复及关闭控制。文章详细解析了Ele、Sign、Divider等可选参数及EndFunc回调，通过代码示例展示如何配置DOM元素、时间类型及分隔符，帮助开发者快速集成简单的页面倒计时功能。
CountDown.js插件介绍
CountDown.js
一个用于实现简易页面倒计时的轻量级工具库
API
按秒数倒计时API
CountDown.openTimeCountBySeconds()依据指定的秒数启动倒计时并展示剩余时间
参数说明：
- Ele: 承载倒计时显示的DOM元素
- CountDownSeconds: 设定的计时总秒数
- Sign: 倒计时标识符（支持多倒计时共用同一标识）
- Divider: 时分秒之间的分隔字符
- EndFunc: 倒计时结束时的回调函数
注：上述参数均为可选
示例代码
CountDown.openTimeCountBySeconds({
Ele: document.getElementById('h1'),
CountDownSeconds: 3600,
Sign: 'flypie',
Divider: ':',
EndFunc: function () {
console.log('end');
}
});按起止日期倒计时API
CountDown.openTimeCountByStartAndEndDate()依据起止时间启动倒计时并展示剩余时间
参数说明：
- Ele: 承载倒计时显示的DOM元素
- StartDate: 倒计时起始时间（Date类型）
- EndDate: 倒计时结束时间（Date类型）
- Sign: 倒计时标识符（支持多倒计时共用同一标识）
- Divider: 时分秒之间的分隔字符
- EndFunc: 倒计时结束时的回调函数
注：除StartDate与EndDate外，其余参数均为可选
示例代码
var startDate = new Date();
var endDate = new Date();
endDate.setDate(endDate.getDate()+1);
CountDown.openTimeCountByStartAndEndDate({
Ele: document.getElementById('h1'),
StartDate: startDate,
EndDate: endDate,
Sign: 'flypie',
Divider: ':',
EndFunc: function () {
console.log('end');
}
});按日期加时间倒计时API
CountDown.openTimeCountByStartAndEndDate()依据起止时间启动倒计时并展示剩余天数及时间
参数说明：
- Ele: 承载倒计时显示的DOM元素
- StartDate: 倒计时起始时间（Date类型）
- EndDate: 倒计时结束时间（Date类型）
- Sign: 倒计时标识符（支持多倒计时共用同一标识）
- Divider: 时分秒之间的分隔字符
- DateDivider: 天数与时间部分之间的分隔字符
- EndFunc: 倒计时结束时的回调函数
注：除StartDate与EndDate外，其余参数均为可选
示例代码
var startDate = new Date();
var endDate = new Date();
endDate.setDate(endDate.getDate()+10);
CountDown.openDateAndTimeCountByStartAndEndDate({
Ele: document.getElementById('h1'),
StartDate: startDate,
EndDate: endDate,
Sign: 'flypie',
Divider: ':',
DateDivider: '天 ',
EndFunc: function () {
console.log('end');
}
});倒计时控制方法
CountDown.stopBySign()依据标识符临时暂停指定的倒计时
CountDown.stopBySign('flypie');CountDown.resumeBySign()依据标识符恢复被临时暂停的倒计时
CountDown.resumeBySign('flypie');CountDown.closeBySign()依据标识符永久关闭指定的倒计时
CountDown.closeBySign('flypie');总结
本文介绍了上述全部内容，旨在为读者的学习或工作提供参考价值，感谢支持。如需了解更多详情，请参阅相关链接。