使用JavaScript实现在页面中显示距离2017年中秋节的天数


Posted in Javascript onSeptember 26, 2017

废话不多说了,具体代码如下所示:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>在页面中显示距离2017年中秋节的天数</title>
  <script type="text/javascript">
    function countdown(title,Intime,divId) {
      var online=new Date(Intime); //根据参数定义时间对象
      var now=new Date();   //定义当前系统时间
      var leave=online.getTime()-now.getTime(); //计算时间差
      var day=Math.floor(leave/(1000*60*60*24))+1;
      if (day>1){
          divId.innerHTML="<b>----距离"+title+"还有"+day+"天!<br/>" ; //页面显示信息
      }else{
        if (day==1){
            divId.innerHTML="<b>----明天就是"+title+"啦!<br/>" ; //页面显示信息
        }else{
          if (day==0) {
            divId.innerHTML = "<b>----今天就是" + title + "呀!<br/>"; //页面显示信息
          }else{
              divId.innerHTML="<b>----哎呀!"+title+"已经过了!<br/>" ; //页面显示信息
            }
          }
        }
    }
  </script>
</head>
<body>
  <table width="350" height="450" border="0" align="center" cellspacing="0" cellpadding="0">
    <tr>
      <td valign="bottom">
        <table width="346" height="418" border="0" align="center" cellspacing="0" cellpadding="0">
          <tr>
            <td width="76"></td>
            <td width="270">
              <div id="countDown">
                <b>---</b></div>
                <script type="text/javascript">
                  countdown("2017年中秋节","10/4/2017",countDown); //调用JavaScript函数
                </script>
            </td>
          </tr>
        </table>
      </td>
    </tr>
  </table>
</body>
</html>

总结

以上所述是小编给大家介绍的 使用JavaScript实现在页面中显示距离2017年中秋节的天数,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript获取GridView选择的行内容
Apr 14 Javascript
js中巧用cssText属性批量操作样式
Mar 13 Javascript
jquery Mobile入门—外部链接切换示例代码
Jan 08 Javascript
jQuery实现返回顶部功能适合不支持js的浏览器
Aug 19 Javascript
动态加载js的方法汇总
Feb 13 Javascript
AngularJS基础 ng-init 指令简单示例
Aug 02 Javascript
AngularJs Modules详解及示例代码
Sep 01 Javascript
jquery属性,遍历,HTML操作方法详解
Sep 17 Javascript
基于Vue插入视频的2种方法小结
Apr 02 Javascript
基于vue开发微信小程序mpvue-docs跳转页面功能
Apr 10 Javascript
基于Vue.js与WordPress Rest API构建单页应用详解
Sep 16 Javascript
Postman内建变量常用方法实例解析
Jul 28 Javascript
Three.js实现绘制字体模型示例代码
Sep 26 #Javascript
Three.js利用Detector.js插件如何实现兼容性检测详解
Sep 26 #Javascript
JS+jQuery实现注册信息的验证功能
Sep 26 #jQuery
详解vue-cli中的ESlint配置文件eslintrc.js
Sep 25 #Javascript
JavaScript 自定义事件之我见
Sep 25 #Javascript
详解在vue-cli中使用路由
Sep 25 #Javascript
Bootstrap一款超好用的前端框架
Sep 25 #Javascript
You might like
PHP+AJAX实现无刷新注册(带用户名实时检测)
2007/01/02 PHP
PHP实现的汉字拼音转换和公历农历转换类及使用示例
2014/07/01 PHP
php 删除cookie方法详解
2014/12/01 PHP
php获取数组元素中头一个数组元素值的实现方法
2014/12/20 PHP
PHP使用strrev翻转中文乱码问题的解决方法
2017/01/13 PHP
javascript禁用键盘功能键让右击及其他键无效
2013/10/09 Javascript
alert出数组中的随即值代码
2014/09/25 Javascript
javascript实现复制与粘贴操作实例
2014/10/16 Javascript
jQuery中element选择器用法实例
2014/12/29 Javascript
jQuery检测鼠标左键和右键点击的方法
2015/03/17 Javascript
纯js模拟div层弹性运动的方法
2015/07/27 Javascript
JavaScript为事件句柄绑定监听函数实例详解
2015/12/15 Javascript
分享两款带遮罩的jQuery弹出框
2015/12/30 Javascript
实例详解jQuery的无new构建
2016/08/02 Javascript
JS提示:Uncaught SyntaxError:Unexpected token ) 错误的解决方法
2016/08/19 Javascript
JavaScript中splice与slice的区别
2017/05/09 Javascript
jQuery实现可兼容IE6的淡入淡出效果告警提示功能示例
2017/09/20 jQuery
原生JS控制多个滚动条同步跟随滚动效果
2017/12/22 Javascript
ES6 Promise对象的含义和基本用法分析
2019/06/14 Javascript
Typescript的三种运行方式(小结)
2019/09/18 Javascript
vue自定义组件(通过Vue.use()来使用)即install的用法说明
2020/08/11 Javascript
[01:35]2018年度CS GO最佳战队-完美盛典
2018/12/17 DOTA
分享一个常用的Python模拟登陆类
2015/03/29 Python
Python基于opencv的图像压缩算法实例分析
2018/05/03 Python
Python urllib request模块发送请求实现过程解析
2020/12/10 Python
CSS3 透明色 RGBA使用介绍
2013/08/06 HTML / CSS
CSS中垂直居中的简单实现方法
2015/07/06 HTML / CSS
美国领先的个性化礼品商城:Personalization Mall
2019/07/27 全球购物
size?荷兰官方网站:英国高级运动鞋精品店
2020/07/24 全球购物
幼儿园大班新学期寄语
2014/01/18 职场文书
歌唱比赛获奖感言
2014/01/21 职场文书
会计学专业学生的求职信范文
2014/01/27 职场文书
中药专业自荐信范文
2014/03/18 职场文书
《法国号》教学反思
2016/02/22 职场文书
深入浅析Redis 集群伸缩原理
2021/05/15 Redis
解决MySQL Varchar 类型尾部空格的问题
2022/04/06 MySQL