javascript实现智能手环时间显示


Posted in Javascript onSeptember 18, 2020

本文实例为大家分享了javascript实现智能手环时间显示的具体代码,供大家参考,具体内容如下

javascript实现智能手环时间显示

代码:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Document</title>
 <style>
  #shijian{
   width: 500px;height: 120px;background-color:#117dbb;
   margin: 50px auto;line-height: 120px;
   color: white;font-size: 22px;
   text-align: center;
   border-radius: 60px;
   box-shadow:#4f535a 0px 5px 10px;
  }
 </style>
</head>
<body>
 <div id ="shijian">显示当前时间</div>
 <script>
  function showtime(){
   var a = new Date()
   var year = a.getFullYear()
   var month =jiaLing(a.getMonth()+1) 
   var day =jiaLing(a.getDate()) 
   var week = weekUp(a.getDay()) 
   var houer =jiaLing(a.getHours()) 
   var minute =jiaLing(a.getMinutes()) 
   var second =jiaLing(a.getSeconds()) 
   var str=year+"年"+month+"月"+day+"日 星期"+week+" " +houer+"时"+minute+"分"+second+"秒"
   return str;
  }
  function weekUp(i){
   var arr = ["日","一","二","三","四","五","六"]
   return arr[i]
  }
  function jiaLing(i){
   if(i<10){
    return "0"+i;
   }else{
    return i;
   }
  }
  setInterval(function(){
   var oDiv= document.getElementById("shijian");
   oDiv.innerHTML = showtime()
  },1000)
 </script>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
理解Javascript_08_函数对象
Oct 15 Javascript
jquery遍历checkbox的注意事项说明
Feb 21 Javascript
解决jQuery动态获取手机屏幕高和宽的问题
May 07 Javascript
js使用循环清空某个div中的input标签值
Sep 29 Javascript
Node.js中的模块机制学习笔记
Nov 04 Javascript
jquery中checkbox全选失效的解决方法
Dec 26 Javascript
浅谈JavaScript中的Math.atan()方法的使用
Jun 14 Javascript
js防阻塞加载的实现方法
Sep 09 Javascript
Vue.js 60分钟快速入门教程
Mar 28 Javascript
基于Vue实现timepicker
Apr 25 Javascript
Vue v2.4中新增的$attrs及$listeners属性使用教程
Jan 08 Javascript
vue 解决provide和inject响应的问题
Nov 12 Javascript
javascript实现打砖块小游戏(附完整源码)
Sep 18 #Javascript
js实现拖拽与碰撞检测
Sep 18 #Javascript
详解JavaScript 的执行机制
Sep 18 #Javascript
鸿蒙系统中的 JS 开发框架
Sep 18 #Javascript
React倒计时功能实现代码——解耦通用
Sep 18 #Javascript
浅谈鸿蒙 JavaScript GUI 技术栈
Sep 17 #Javascript
vue项目中播放rtmp视频文件流的方法
Sep 17 #Javascript
You might like
PHP中PDO的错误处理
2011/09/04 PHP
用来解析.htgroup文件的PHP类
2012/09/05 PHP
解析PHP高效率写法(详解原因)
2013/06/20 PHP
PHP实现十进制、二进制、八进制和十六进制转换相关函数用法分析
2017/04/25 PHP
PHP实现的获取文件mimes类型工具类示例
2018/04/08 PHP
PHP设计模式(六)桥连模式Bridge实例详解【结构型】
2020/05/02 PHP
js用typeof方法判断undefined类型
2014/07/15 Javascript
jquery树形菜单效果的简单实例
2016/06/06 Javascript
javascript实现瀑布流动态加载图片原理
2016/08/12 Javascript
微信小程序 两种滑动方式(横向滑动,竖向滑动)详细及实例代码
2017/01/13 Javascript
js输入框使用正则表达式校验输入内容的实例
2017/02/12 Javascript
js前端日历控件(悬浮、拖拽、自由变形)
2017/03/02 Javascript
5分钟打造简易高效的webpack常用配置
2017/07/04 Javascript
React-Native 组件之 Modal的使用详解
2017/08/08 Javascript
vue数据控制视图源码解析
2018/03/28 Javascript
Vue简单封装axios之解决post请求后端接收不到参数问题
2020/02/16 Javascript
[51:32]Optic vs Serenity 2018国际邀请赛淘汰赛BO3 第一场 8.22
2018/08/23 DOTA
进一步理解Python中的函数编程
2015/04/13 Python
python开发中range()函数用法实例分析
2015/11/12 Python
python 多线程实现检测服务器在线情况
2015/11/25 Python
python实现图书借阅系统
2019/02/20 Python
Pandas之ReIndex重新索引的实现
2019/06/25 Python
python文档字符串(函数使用说明)使用详解
2019/07/30 Python
python实现二分类的卡方分箱示例
2019/11/22 Python
使用OpenCV circle函数图像上画圆的示例代码
2019/12/27 Python
python GUI库图形界面开发之PyQt5信号与槽机制、自定义信号基础介绍
2020/02/25 Python
荷兰鞋类购物网站:Donelli
2019/05/24 全球购物
英国在线定制百叶窗网站:Swift Direct Blinds
2020/02/25 全球购物
《可爱的动物》教学反思
2014/02/22 职场文书
奥巴马连任演讲稿
2014/05/15 职场文书
中国梦团日活动总结
2014/07/07 职场文书
大学生求职自荐信
2015/03/24 职场文书
新店开张宣传语
2015/07/13 职场文书
公司考勤管理制度
2015/08/04 职场文书
golang slice元素去重操作
2021/04/30 Golang
解决Windows Server2012 R2 无法安装 .NET Framework 3.5
2022/04/29 Servers