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 相关文章推荐
JS对img标签进行优化使用onerror显示默认图像
Apr 24 Javascript
详解照片瀑布流效果(js,jquery分别实现与知识点总结)
Jan 01 Javascript
Bootstrap实现渐变顶部固定自适应导航栏
Aug 27 Javascript
从零开始学习Node.js系列教程四:多页面实现数学运算的client端和server端示例
Apr 13 Javascript
Node.js v8.0.0正式发布!看看带来了哪些主要新特性
Jun 02 Javascript
mac上node.js环境的安装测试
Jul 03 Javascript
一篇文章让你彻底弄懂JS的事件冒泡和事件捕获
Aug 14 Javascript
p5.js实现斐波那契螺旋的示例代码
Mar 22 Javascript
微信小程序利用canvas 绘制幸运大转盘功能
Jul 06 Javascript
JS查找孩子节点简单示例
Jul 25 Javascript
基于Element封装一个表格组件tableList的使用方法
Jun 29 Javascript
如何用JavaScipt测网速
May 09 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
PNG背景在不同浏览器下的应用
2009/06/22 Javascript
JS HTML5 音乐天气播放器(Ajax获取天气信息)
2013/05/26 Javascript
asp.net刷新本页面的六种方法总结
2014/01/07 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
2014/06/15 Javascript
简单解析JavaScript中的__proto__属性
2016/05/10 Javascript
JavaScript检测原始值、引用值、属性
2016/06/20 Javascript
简单易懂的天气插件(代码分享)
2017/02/04 Javascript
html5+canvas实现支持触屏的签名插件教程
2017/05/08 Javascript
JavaScript箭头函数_动力节点Java学院整理
2017/06/28 Javascript
jQuery.Ajax()的data参数类型详解
2017/07/23 jQuery
Node 自动化部署的方法
2017/10/17 Javascript
微信小程序实现红包功能(后端PHP实现逻辑)
2018/07/11 Javascript
微信小程序实现发红包功能
2018/07/11 Javascript
小程序组件之仿微信通讯录的实现代码
2018/09/12 Javascript
vue组件 keep-alive 和 transition 使用详解
2019/10/11 Javascript
[55:02]2014 DOTA2国际邀请赛中国区预选赛 HGT VS Orenda
2014/05/21 DOTA
python thread 并发且顺序运行示例
2009/04/09 Python
python k-近邻算法实例分享
2014/06/11 Python
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
Python类的定义、继承及类对象使用方法简明教程
2015/05/08 Python
Python中序列的修改、散列与切片详解
2017/08/27 Python
python爬虫基本知识
2018/03/05 Python
python微信公众号开发简单流程
2018/03/23 Python
11个Python Pandas小技巧让你的工作更高效(附代码实例)
2019/04/30 Python
Python3.6实现根据电影名称(支持电视剧名称),获取下载链接的方法
2019/08/26 Python
Python内置类型性能分析过程实例
2020/01/29 Python
Python使用多进程运行含有任意个参数的函数
2020/05/02 Python
基于python实现简单网页服务器代码实例
2020/09/14 Python
完美解决IE8下不兼容rgba()的问题
2017/03/31 HTML / CSS
加拿大在线旅游公司:Flighthub
2019/03/11 全球购物
英国网上电器商店:Electricshop
2020/03/15 全球购物
创建绿色学校先进个人材料
2014/08/20 职场文书
党员违纪检讨书怎么写
2014/11/01 职场文书
2019下半年英语教师的教学工作计划(3篇)
2019/09/25 职场文书
Python趣味挑战之用pygame实现简单的金币旋转效果
2021/05/31 Python
Apache Hudi集成Spark SQL操作hide表
2022/03/31 Servers