<html>
<head>
<title>2011倒计时</title>
</head>
<body>
<script type="text/javascript">
window.onload = function(){
var curDate = new Date();//当前时间
var expireDate = new Date(2012,0,1);//到期时间
var milSecond = expireDate.getTime() - curDate.getTime();
var totalSeconds = removeDecimal(milSecond/1000);//剩余秒(应该用服务器时间替代)
timeGo(totalSeconds);
}
function timeGo(totalSeconds){
setInterval(function(){
totalSeconds--;
calculateTime(totalSeconds);
},1000);
}
function calculateTime(totalSeconds){
if (totalSeconds > 0) {
var leftDays = removeDecimal(totalSeconds/60/60/24);//剩余天数
var seconds = totalSeconds%(60*60*24);
var leftHours = removeDecimal(seconds/60/60);//剩余小时
var leftMinutes = removeDecimal(seconds/60%60);//剩余分
var leftSeconds = removeDecimal(seconds%60);//剩余秒
setLeftTime(leftDays,leftHours,leftMinutes,leftSeconds);
} else {
document.getElementById('countDown').innerHTML='Happy new year!';
}
}
function setLeftTime(leftDays,leftHours,leftMinutes,leftSeconds){
document.getElementById('leftDay').innerHTML=leftDays;
document.getElementById('leftHour').innerHTML=leftHours;
document.getElementById('leftMinute').innerHTML=leftMinutes;
document.getElementById('leftSecond').innerHTML=leftSeconds;
}
//去除小数
function removeDecimal(number){
return Math.floor(number);
}
</script>
<div id="countDown">
2011年倒计时：
<span id="leftDay" style="background:red"></span>天
<span id="leftHour"></span>小时
<span id="leftMinute"></span>分
<span id="leftSecond"></span>秒
</div>
</body>
</html>
分享到：
相关推荐
总之，JS倒计时功能的实现不仅涉及到对时间的精确控制，还需要熟练掌握DOM操作和JavaScript定时器的使用，从而实现在网页上动态显示倒计时直至某一时间点触发特定事件的完整功能。通过以上分析，我们不仅了解了基本...
### JavaScript倒计时功能解析 #### 一、概述 在前端开发中，倒计时功能是一种常见的需求，常用于活动倒计时、秒杀计时等场景。通过JavaScript实现倒计时不仅可以提升用户体验，还能增强页面的交互性。本文将详细...
本文提供了一个全面的 JavaScript 倒计时功能实现指南，从基础的实现到高级应用技巧，旨在帮助开发者掌握如何在网页中创建动态和互动的倒计时效果。通过实际的代码示例和详细的步骤说明，读者可以快速学会并应用这些...
纯JS的倒计时跳转功能，可自由设计样式……
本文将深入探讨“倒计时功能插件js”的相关知识点，帮助开发者理解如何利用JavaScript实现倒计时功能。 首先，倒计时功能是网页或应用中常见的一种交互元素，通常用于事件预告、促销活动等场景。在JavaScript中，...
日常开发中，电商经常使用到抢购，不过当抢购的时候会用到倒计时
8. **模块化和封装**：在`TimeCircles.js`文件中，我们可以推测这是一个实现了环形倒计时功能的JavaScript模块。它可能包含一个构造函数，接收开始时间、持续时间等参数，以及初始化、更新和结束等方法。 9. **响应...
倒数计时器是JavaScript中常见的功能，它可以在网页上显示剩余时间，比如用于活动倒计时、考试倒计时等场景。本教程将详细讲解如何创建一个简单的JS倒数计时器，并教你如何理解并修改代码以适应自己的需求。 首先，...
<title>JavaScript倒计时 <h1 id="countdown"></h1> <script src="js/countdown.js"> ``` 在`js`文件夹中的`countdown.js`文件应该包含上述的JavaScript代码。 这个基本的倒计时功能可以适应大多数需求，但...
JavaScript倒计时是一种常见的网页动态效果，用于显示特定时间点前的剩余时间。在这个场景中，我们有一个名为"timer.html"的文件，很可能是包含一个简单的JavaScript倒计时实现的HTML页面。下面将详细讲解JavaScript...
JavaScript（简称JS）是一种轻量级的解释型编程...通过上述步骤，你就可以在网页上实现一个基本的JavaScript倒计时功能了。在开发过程中，还可以添加更多细节，如格式化输出、动态效果、用户交互等，以提升用户体验。
JavaScript倒计时是一种常见的时间显示方式，常用于网站上的活动预告、考试倒计时或重要事件提醒等。在这个实例中，我们结合了JavaScript、CSS和jQuery来创建一个动态且具有视觉效果的倒计时计时器。以下是相关知识...
JavaScript（简称JS）倒计时源码是一种常见的前端开发技术，用于实现网页上的时间计时功能，例如活动截止、考试开始等场景。本资源包含一个实现了天、小时、分钟和秒显示的倒计时功能的JS代码示例。下面将详细讲解JS...
JavaScript倒数计时器是一种...以上就是JavaScript倒计时器的基本实现。通过这个功能，我们可以创建一个简单的网页，用户可以清楚地看到距离特定日期还有多少时间。这个例子中的代码简洁明了，适合初学者学习和参考。
JavaScript与jQuery实现的用户注册...* JavaScript倒计时功能实现 * jQuery倒计时功能实现 * 使用setInterval函数创建计时器 * 使用JavaScript与jQuery实现用户注册协议倒计时功能 * 倒计时功能在用户注册协议中的应用
原生JavaScript倒计时功能是一种常见且实用的网页交互手段，允许开发者在不依赖任何第三方库的情况下实现时间的倒数计算。本文将详细介绍如何使用纯JavaScript代码来实现多种格式的倒计时功能，适用于初学者和中级...
在网页中，JS可以用于实现各种动态效果，包括我们今天要讨论的主题——倒计时功能。倒计时在网页中应用广泛，如活动预告、考试倒计时等，能给用户带来实时的时间感知。 倒计时的基本原理是通过计算当前时间与目标...
在Vue.js框架中实现天时分秒倒计时效果，主要涉及到组件化开发、时间处理、数据绑定以及定时器的使用。以下是对这个项目中关键知识点的详细解释： 1. **Vue.js**: Vue.js 是一个轻量级的前端JavaScript框架，它提供...
首先，我们需要理解JavaScript倒计时的基本原理。倒计时通常是基于当前时间与目标时间之间的差值计算的。在JavaScript中，我们可以使用`Date`对象来获取当前时间，然后通过计算目标时间与当前时间的差值，设置定时器...
在这个案例中，“js写的倒计时功能，简单漂亮交互好”指的是使用JavaScript实现的一个具有视觉吸引力且用户交互体验良好的倒计时组件。 倒计时功能在网页上有着广泛的应用，例如活动预告、考试倒计时、新年倒计时等...