JS如何实现一个简易在线时钟？在实际的项目中，有时候我们需要实现网页在线时钟的功能，那么用JavaScript怎么编写代码呢？对此，本文分享两个方法供大家参考，感兴趣的朋友可以了解看看，接下来就跟随小编学习一下吧。

    本教程操作环境：windows10系统、javascript1.8.5版、Dell G3电脑。

    javascript怎样实现网页在线时钟功能

    javascript是一种基于对象（Object)和事件驱动（Event Driven)的脚本语言，它运行在客户端，从而减轻了服务器端的负担。一个完整的    javascript是由核心语法、浏览器对象模型和文档对象模型组成。现在，与大家分享如何实现页面上的一个小功能，时钟实时显示。

    创建日期对象：Date对象包含日期和时间两个信息，创建日期对象的基本语法有两种：

    方法一：var 日期实例=new Date(参数）;

    方法二：var 日期实例=new Date( );

    通过Date对象的get方法获取日期、时间等。为了在页面上显示，可以使用DOM中的innerHTML属性进行设置。

    使用if语句判断当前小时是否大于12，从而判断上、下午。

    如何进行实时显示呢？javascript中提供了两种定时函数：setTimeout( )和setInterval( )。

• setTimeout():用于在指定的毫秒数后调用函数或计算表达式。

• setInterval(): 可按照指定的周期（以毫秒计）来调用函数或计算表达式。

    这里显然选择使用setInterval( )方法来实现，页面实时显示时间。

    通过上面的步骤就完成了时间实时显示的代码设计，完整代码如下所示：

    最后，运行就OK啦，运行效果如图所示。注意，这个时候时间是实时变化的，即一秒变一次。

    以上就是用JS实现一个简易在线时钟的方法分享，本文只是提供了一种实现思路，代码仅供参考，需要的朋友可以了解看看，希望对大家学习JavaScript有帮助，想要了解更多可以继续浏览群英网络其他相关的文章。

文本转载自PHP中文网

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• 用JavaScript如何判定和求100内的素数

  求素数的方法：1、遍历1~n区间中的所有自然数给n来除，若余数为0则表示该数n不是素数，否则就是素数，语法“for(i=2;i<n;i++){if(n%i===0){return false;}}”。2、利用素数平方根范围，语法“for(i=2;i<=Math.sqrt(n);i++){if(n%i===0){return false;}}”。

• 小程序购物车功能怎样做，关键要点是什么

  这篇文章主要为大家详细介绍了微信小程序实现购物车小功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

• async和await实现同步的代码怎样写的

  首先我们假设有一方法 readFile 可以读取文件内容, 但是它是异步的。var gen = function* (){    var a = yield readFile('./a.txt');    console.log(a.toString());

• Node.js中的Buffer怎么创建，写法是怎样的

  本篇文章带大家深入了解下Node.js中的 Buffer（缓冲区），介绍一下创建 Buffer 类的多种方式、写入缓冲区的方法等，希望对大家有所帮助！

• 在JS中怎么自定义日历,代码是什么

  这篇文章主要为大家详细介绍了JavaScript自定义日历效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下