js定时器，将当前系统的时间渲染到网页（每隔一秒钟，重新获取一次时间，拼接渲染到网页）

先简单的添加一点样式

div {width: 500px;height: 100px;background-color: #dadada;font-size: 28px;margin: 0 auto;text-align: center;line-height: 100px;}

思路：获取当前系统的日期，将其年，月，日，时，分，秒提取出来，利用字符串拼接并渲染到网页中，最后将所有程序放入周期性定时器的回调函数中，调整间隔时间为1s。

 <div id="clock"></div><script>function fn() {var date = new Date() //获取当前系统日期var y = date.getFullYear() //获取年var m = date.getMonth() + 1 //获取月var d = date.getDate() //获取日var h = date.getHours() //获取时var min = date.getMinutes() //获取分var s = date.getSeconds() //获取秒clock.innerHTML = `现在是${y}年${m}月${d}日 ${h<10 ? '0'+h : h}:${min<10 ? '0'+min : min}:${s<10 ? '0'+s : s}`//利用三元表达式 当其小于10时 在其前面拼接一个'0'}fn() //打开网页，就要渲染一次// 周期定时器setInterval(fn, 1000) //间隔时间 1000ms</script>

不使用时可以使用 clearInterval() 进行清除。

Node.js中的几种定时器：

1.一次性定时器

开启：

var timer=setTimeout( 回调函数, 间隔时间 )

当间隔时间到了，会调用一次回调函数，时间单位是毫秒

清除：

clearTimeout(timer)

2.周期性定时器

开启：

var timer=setInterval( 回调函数, 间隔时间 )

每隔一段时间，调用一次回调函数

清除：

clearInterval(timer)

3.立即执行定时器

开启：

var timer=setImmediate( 回调函数 )

清除：

clearImmediate(timer)

另一个立即执行定时器

process.nextTick( 回调函数 )

提示：这个立即执行定时器,相比上一个立即执行器setImmediate（）先执行

注意：定时器中的回调函数会放入到主程序后的事件队列(一组回调函数组成)中执行

js定时器，将当前系统的时间渲染到网页（每隔一秒钟，重新获取一次时间，拼接渲染到网页）相关推荐

微信小程序渲染层错误：可以在AppData中获取到值但无法渲染到页面
微信小程序渲染层错误:可以在AppData中获取到值但无法渲染到页面 1.遇到的问题: 2.解释: 3.附上正确的完整代码: 在我跟着视频(bili:BV1nE41117BQ)P78 学做小程序的过程 ...
java格式化时间字符串毫秒_SimpleDateFormat是否有格式字符串来获取毫秒日期时间值,而不是人类可读的格式?...
旧的和过时的 SimpleDateFormat 类不能这样做.它的替代品,现代的 DateTimeFormatter ,可以. DateTimeFormatter epochMilliFormatte ...
js获取当前年月日时间
let date = new Date(); date .getYear(); //获取当前年份(2位) date .getFullYear(); //获取完整的年份(4位) date .getMon ...
c语言获取文件修改时间,（C语言）获取并修改文件夹时间（创建时间、修改时间、访问时间）...
背景在Windows系统下没有提供可以对文件夹时间属性修改的方法或者API,在上一篇文章中我们提到了文件时间的函数,那么我们可以以打开文件的方式打开文件夹,然后通过修改文件时间的API函数对文件夹时 ...
js如何获取计算机当前时间,js获取当前系统时间
搜索热词下面是编程之家 jb51.cc 通过网络收集整理的代码片段. 编程之家小编现在分享给大家,也给大家做个参考. var myDate = new Date(); myDate.getYear( ...
ajax定时器怎么写,js定时器怎么写？就是在特定时间执行某段程序
js定时器怎么写?就是在特定时间执行某段程序复制代码代码如下: $(function(){ var handler = function(){ } var timer = setInterval( ...
Node.js +个人博客系统搭建设计方案
目录 1.Node开发基础 1.1基础(服务器端开发) 1.2模块加载及第三方包 1.2.1 Node.js模块化开发 1.2.2 系统模块 1.2.3第三方模块(包) 1.2.4模块加载机制 2.请 ...
的setinterval函数_Vue定时器与JS 定时器 setInterval() 和 setTimeout()
H5前端开发社区专注更多编程教程和电子书天天在用钱在vue中,有两套定时器,一套是浏览器API,window对象上的:另一套就是vue/nodejs封装的,需要引入 import { setInter ...
js最小化浏览器_「译」解析、抽象语法树(ast) +如何最小化解析时间的5个技巧...
前言该系列课程会在本周陆续更新完毕,主要讲解的都是工作中可能会遇到的真实开发中比较重要的问题以及相应的解决方法.通过本系列的课程学习,希望能对你日常的工作带来些许变化.当然,欢迎大家关注我,我将持续 ...
js 定时器用法详解——setTimeout()、setInterval()、clearTimeout()、clearInterval()
写在前面: 在js应用中,定时器的作用就是可以设定当到达一个时间来执行一个函数,或者每隔几秒重复执行某段函数.这里面涉及到了三个函数方法:setInterval().setTimeout().clea ...

js定时器，将当前系统的时间渲染到网页（每隔一秒钟，重新获取一次时间，拼接渲染到网页）

Node.js中的几种定时器：

js定时器，将当前系统的时间渲染到网页（每隔一秒钟，重新获取一次时间，拼接渲染到网页）相关推荐

最新文章

热门文章