使用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 相关文章推荐
JS高级笔记
Jul 13 Javascript
实现JavaScript的组成----BOM和DOM详解
May 18 Javascript
Three.js学习之正交投影照相机
Aug 01 Javascript
JavaScript获取服务器端时间的方法
Nov 29 Javascript
Angular2自定义分页组件
Apr 19 Javascript
如何理解Vue的作用域插槽的实现原理
Aug 19 Javascript
js循环map 获取所有的key和value的实现代码(json)
May 09 Javascript
React Router V4使用指南(精讲)
Sep 17 Javascript
vue实现页面滚动到底部刷新
Aug 16 Javascript
vue video和vue-video-player实现视频铺满教程
Oct 30 Javascript
详细聊聊vue中组件的props属性
Nov 02 Vue.js
vue组件冲突之引用另一个组件出现组件不显示的问题
Apr 13 Vue.js
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一行代码获取文件后缀名实例分析
2014/11/12 PHP
php安装dblib扩展,连接mssql的具体步骤
2017/03/02 PHP
PHP curl 或 file_get_contents 获取需要授权页面的方法
2017/05/05 PHP
由php中字符offset特征造成的绕过漏洞详解
2017/07/07 PHP
PHPUnit测试私有属性和方法功能示例
2018/06/12 PHP
PHP实现负载均衡的加权轮询方法分析
2018/08/22 PHP
JavaScript window.document的属性、方法和事件小结
2012/10/24 Javascript
nodeType属性返回被选节点的节点类型介绍
2013/11/22 Javascript
js鼠标点击图片实现随机变换图片的方法
2015/02/16 Javascript
js同源策略详解
2015/05/21 Javascript
Ionic快速安装教程
2016/06/03 Javascript
extjs简介_动力节点Java学院整理
2017/07/17 Javascript
基于JavaScript实现百度搜索框效果
2020/06/28 Javascript
利用JS做网页特效_大图轮播(实例讲解)
2017/08/09 Javascript
JavaScript面向对象的程序设计(犯迷糊的小羊)
2018/05/27 Javascript
JS构造一个html文本内容成文件流形式发送到后台
2018/07/31 Javascript
vue实现分页组件
2020/06/16 Javascript
使用Angular Cli如何创建Angular私有库详解
2019/01/30 Javascript
Nodejs监听日志文件的变化的过程解析
2019/08/04 NodeJs
javascript头像上传代码实例
2019/09/28 Javascript
uni-app 组件里面获取元素宽高的实现
2019/12/27 Javascript
jQuery实现放大镜案例
2020/10/19 jQuery
Python中import导入上一级目录模块及循环import问题的解决
2016/06/04 Python
Python中的上下文管理器相关知识详解
2019/09/19 Python
Keras loss函数剖析
2020/07/06 Python
详解使用Python写一个向数据库填充数据的小工具(推荐)
2020/09/11 Python
Python绘图实现台风路径可视化代码实例
2020/10/23 Python
python中pdb模块实例用法
2021/01/15 Python
JINS眼镜官方网站:日本最大的眼镜邮购
2016/10/14 全球购物
学生自我鉴定范文
2013/10/04 职场文书
设计大赛策划方案
2014/06/13 职场文书
2015年体育部工作总结
2015/04/02 职场文书
深度学习详解之初试机器学习
2021/04/14 Python
Go语言切片前或中间插入项与内置copy()函数详解
2021/04/27 Golang
python实现三次密码验证的示例
2021/04/29 Python
PYTHON使用Matplotlib去实现各种条形图的绘制
2022/03/22 Python