使用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 相关文章推荐
dojo学习第二天 ajax异步请求之绑定列表
Aug 29 Javascript
chrome下img加载对height()的影响示例探讨
May 26 Javascript
jQuery中index()方法用法实例
Dec 27 Javascript
jquery实现上下左右滑动的方法
Feb 09 Javascript
javascript制作网页图片上实现下雨效果
Feb 26 Javascript
jQuery页面刷新(局部、全部)问题分析
Jan 09 Javascript
对javascript继承的理解
Oct 11 Javascript
js中编码函数:escape,encodeURI与encodeURIComponent详解
Mar 21 Javascript
js模拟百度模糊搜索的实例
Aug 04 Javascript
javascript中call()、apply()的区别
Mar 21 Javascript
js实现鼠标拖拽缩放div实例代码
Mar 25 Javascript
layui实现tab的添加拒绝重复的方法
Sep 04 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代替JS玩转DOM的思路及示例代码
2014/06/15 PHP
php读取flash文件高宽帧数背景颜色的方法
2015/01/06 PHP
php中使用sftp教程
2015/03/30 PHP
php curl 上传文件代码实例
2015/04/27 PHP
php中memcache 基本操作实例
2015/05/17 PHP
PHP扩展Memcache分布式部署方案
2015/12/06 PHP
Laravel实现搜索的时候分页并携带参数
2019/10/15 PHP
boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
2010/11/21 Javascript
jQuery去掉字符串起始和结尾的空格(多种方法实现)
2013/04/01 Javascript
JS使用ajax从xml文件动态获取数据显示的方法
2015/03/24 Javascript
js+html5获取用户地理位置信息并在Google地图上显示的方法
2015/06/05 Javascript
基于jQuery 实现bootstrapValidator下的全局验证
2015/12/07 Javascript
AngularJS中$watch和$timeout的使用示例
2016/09/20 Javascript
Bootstrap源码解读按钮(5)
2016/12/23 Javascript
javascript容错处理代码(屏蔽js错误)
2017/01/20 Javascript
Angular获取手机验证码实现移动端登录注册功能
2017/05/17 Javascript
JS获取鼠标坐标并且根据鼠标位置不同弹出不同内容
2017/06/12 Javascript
Angularjs 事件指令详细整理
2017/07/27 Javascript
解决Mac下安装nmp的淘宝镜像失败问题
2018/05/16 Javascript
layui layer select 选择被遮挡的解决方法
2019/09/21 Javascript
浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】
2019/10/23 Javascript
Laravel 如何在blade文件中使用Vue组件的示例代码
2020/06/28 Javascript
Python中使用wxPython开发的一个简易笔记本程序实例
2015/02/08 Python
使用python编写简单的小程序编译成exe跑在win10上
2018/01/15 Python
Python中py文件引用另一个py文件变量的方法
2018/04/29 Python
Django中使用第三方登录的示例代码
2018/08/20 Python
numpy.random模块用法总结
2019/05/27 Python
python实现实时视频流播放代码实例
2020/01/11 Python
HTML5 和小程序实现拍照图片旋转、压缩和上传功能
2018/10/08 HTML / CSS
应届生污水处理求职信
2013/11/06 职场文书
秋季开学典礼主持词
2014/03/19 职场文书
人力资源管理求职信
2014/08/07 职场文书
医德医魂心得体会
2014/09/11 职场文书
2014年环保工作总结
2014/11/26 职场文书
JS如何实现基于websocket的多端桥接平台
2021/05/14 Javascript
React + Threejs + Swiper 实现全景图效果的完整代码
2021/06/28 Javascript