使用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 相关文章推荐
运用jquery实现table单双行不同显示并能单行选中
Jul 25 Javascript
jQuery方法简洁实现隔行换色及toggleClass的使用
Mar 15 Javascript
JS 获取浏览器和屏幕宽高等信息的实现思路及代码
Jul 31 Javascript
node.js使用nodemailer发送邮件实例
Mar 10 Javascript
基于javascript的COOkie的操作实现只能点一次
Dec 26 Javascript
跟我学习javascript解决异步编程异常方案
Nov 23 Javascript
JQuery实现的按钮倒计时效果
Dec 23 Javascript
JavaScript每天必学之数组和对象部分
Sep 17 Javascript
Vue中在新窗口打开页面及Vue-router的使用
Jun 13 Javascript
微信小程序实现手指触摸画板
Jul 09 Javascript
浅谈vue限制文本框输入数字的正确姿势
Sep 02 Javascript
浅谈layer弹出层按钮颜色修改方法
Sep 11 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脚本的10个技巧(6)
2006/10/09 PHP
PHP入门教程之图像处理技巧分析
2016/09/11 PHP
php版微信公众账号第三方管理工具开发简明教程
2016/09/23 PHP
基于php数组中的索引数组和关联数组详解
2018/03/12 PHP
JS日历 推荐
2006/12/03 Javascript
JS对HTML标签select的获取、添加、删除操作
2013/10/17 Javascript
jQuery元素的隐藏与显示实例
2015/01/20 Javascript
js封装成插件_Canvas统计图插件编写实例
2017/09/12 Javascript
vue使用element-ui的el-input监听不了回车事件的解决方法
2018/01/12 Javascript
js中的闭包学习心得
2018/02/06 Javascript
Js中将Long转换成日期格式的实现方法
2018/06/05 Javascript
JS实现的自定义map方法示例
2019/05/17 Javascript
vue项目前端错误收集之sentry教程详解
2019/05/27 Javascript
element-ui 弹窗组件封装的步骤
2021/01/22 Javascript
Python os模块介绍
2014/11/30 Python
python处理图片之PIL模块简单使用方法
2015/05/11 Python
详解python函数传参是传值还是传引用
2018/01/16 Python
Python2.x与3​​.x版本有哪些区别
2020/07/09 Python
Python爬虫爬取有道实现翻译功能
2020/11/27 Python
详解Python遍历列表时删除元素的正确做法
2021/01/07 Python
HTML5本地存储之Database Storage应用介绍
2013/01/06 HTML / CSS
一款利用html5和css3动画排列人物头像的实例演示
2014/12/05 HTML / CSS
canvas实现烟花的示例代码
2020/01/16 HTML / CSS
俄罗斯三星品牌商店:Samsungstore
2020/04/05 全球购物
写出二分查找算法的两种实现
2013/05/13 面试题
超市实习总结自我鉴定
2013/09/19 职场文书
高中生学习生活的自我评价
2013/10/09 职场文书
医院实习接收函
2014/01/12 职场文书
保卫科工作岗位职责
2014/03/01 职场文书
信用卡工资证明格式
2014/09/13 职场文书
2014年社区矫正工作总结
2014/11/18 职场文书
2014年节能减排工作总结
2014/12/06 职场文书
销售经理助理岗位职责
2015/04/13 职场文书
JS Object构造函数之Object.freeze
2021/04/28 Javascript
如何用PHP websocket实现网页实时聊天
2021/05/26 PHP
Vue h函数的使用详解
2022/02/18 Vue.js