热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

js在线更新时间

文章目录需求分析代码 提示:以下是本篇文章正文内容,下面案例可供参考分析 首先获取日期对象,赋值给变量newTime;通过getFullYear&#xff

文章目录

    • 需求
    • 分析
    • 代码




在这里插入图片描述


需求

在这里插入图片描述

输出当前日期在页面上,日期不断更新。

提示:以下是本篇文章正文内容,下面案例可供参考

分析



  1. 首先获取日期对象,赋值给变量newTime;
  2. 通过getFullYear()等方法得到当前年月日时分秒;
  3. 得到的月份默认为从0月开始,就是中国的一月份,所以要把得到的月份加1输出。
  4. 得到的星期是从1开始,到6结束,周日是0;所以定义一个数组,数组第一个值是日,按下标输出。
  5. 时分秒输出时,如果小于10,就会输出1,我们要的效果时01,所以加一个判断

代码

代码如下(示例):

window.onload &#61; function() {var p &#61; document.getElementsByTagName(&#39;p&#39;)[0];var arr &#61; [&#39;日&#39;, &#39;一&#39;, &#39;二&#39;, &#39;三&#39;, &#39;四&#39;, &#39;五&#39;, &#39;六&#39;]var newtime;var years, months, dates, days, hours, minutes, seconds;setInterval(getNow, 1000);function getNow() {newtime &#61; new Date();years &#61; newtime.getFullYear();months &#61; newtime.getMonth() &#43; 1;dates &#61; newtime.getDate();days &#61; newtime.getDay();console.log(days);hours &#61; newtime.getHours();hours &#61; hours < 10 ? &#39;0&#39; &#43; hours : hours;minutes &#61; newtime.getMinutes();minutes &#61; minutes < 10 ? &#39;0&#39; &#43; minutes : minutes;seconds &#61; newtime.getSeconds();seconds &#61; seconds < 10 ? &#39;0&#39; &#43; seconds : seconds;p.innerHTML &#61; &#39;今天是&#39; &#43; years &#43; &#39;年&#39; &#43; months &#43; &#39;月&#39; &#43; dates &#43; &#39;号&#39; &#43; &#39;星期&#39; &#43; arr[days] &#43; " " &#43; hours &#43; &#39;:&#39; &#43; minutes &#43; &#39;:&#39; &#43; seconds;}


推荐阅读
  • 前言--页数多了以后需要指定到某一页(只做了功能,样式没有细调)html ... [详细]
  • 本文详细介绍了如何解决Uploadify插件在Internet Explorer(IE)9和10版本中遇到的点击失效及JQuery运行时错误问题。通过修改相关JavaScript代码,确保上传功能在不同浏览器环境中的一致性和稳定性。 ... [详细]
  • 本文介绍了如何利用JavaScript或jQuery来判断网页中的文本框是否处于焦点状态,以及如何检测鼠标是否悬停在指定的HTML元素上。 ... [详细]
  • 导航栏样式练习:项目实例解析
    本文详细介绍了如何创建一个具有动态效果的导航栏,包括HTML、CSS和JavaScript代码的实现,并附有详细的说明和效果图。 ... [详细]
  • 深入理解Cookie与Session会话管理
    本文详细介绍了如何通过HTTP响应和请求处理浏览器的Cookie信息,以及如何创建、设置和管理Cookie。同时探讨了会话跟踪技术中的Session机制,解释其原理及应用场景。 ... [详细]
  • 深入理解 Oracle 存储函数:计算员工年收入
    本文介绍如何使用 Oracle 存储函数查询特定员工的年收入。我们将详细解释存储函数的创建过程,并提供完整的代码示例。 ... [详细]
  • 本文详细介绍如何使用Python进行配置文件的读写操作,涵盖常见的配置文件格式(如INI、JSON、TOML和YAML),并提供具体的代码示例。 ... [详细]
  • 技术分享:从动态网站提取站点密钥的解决方案
    本文探讨了如何从动态网站中提取站点密钥,特别是针对验证码(reCAPTCHA)的处理方法。通过结合Selenium和requests库,提供了详细的代码示例和优化建议。 ... [详细]
  • 本文介绍了如何使用JQuery实现省市二级联动和表单验证。首先,通过change事件监听用户选择的省份,并动态加载对应的城市列表。其次,详细讲解了使用Validation插件进行表单验证的方法,包括内置规则、自定义规则及实时验证功能。 ... [详细]
  • UNP 第9章:主机名与地址转换
    本章探讨了用于在主机名和数值地址之间进行转换的函数,如gethostbyname和gethostbyaddr。此外,还介绍了getservbyname和getservbyport函数,用于在服务器名和端口号之间进行转换。 ... [详细]
  • 本文介绍如何通过Windows批处理脚本定期检查并重启Java应用程序,确保其持续稳定运行。脚本每30分钟检查一次,并在需要时重启Java程序。同时,它会将任务结果发送到Redis。 ... [详细]
  • 在使用 MUI 框架进行应用开发时,开发者常常会遇到 mui.init() 和 mui.plusReady() 这两个方法。本文将详细解释它们的区别及其在不同开发环境下的应用。 ... [详细]
  • 深入理解Java泛型:JDK 5的新特性
    本文详细介绍了Java泛型的概念及其在JDK 5中的应用,通过具体代码示例解释了泛型的引入、作用和优势。同时,探讨了泛型类、泛型方法和泛型接口的实现,并深入讲解了通配符的使用。 ... [详细]
  • 本文详细介绍了中央电视台电影频道的节目预告,并通过专业工具分析了其加载方式,确保用户能够获取最准确的电视节目信息。 ... [详细]
  • 本文介绍如何使用Objective-C结合dispatch库进行并发编程,以提高素数计数任务的效率。通过对比纯C代码与引入并发机制后的代码,展示dispatch库的强大功能。 ... [详细]
author-avatar
素材火2
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有