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>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • json格式的时间显示为正常年月日的方法

    json格式的时间显示为:/Date(1377828670436)/需要转换为正常年月日,方法如下: 复制代码 代码如下: //通过序列化转换出来的json,如果里面有DateTime格式的,就不会正常显示时间,用下面的方法就可以了 var date=renderTime(json.AddDateTime); //把读出来的json格式时间传入这个方法内 function renderTime(date){ var da = new Date(parseInt(date.replace("/Da

  • 纯js实现动态时间显示

    本文实例为大家分享了js动态时间显示 的具体代码,供大家参考,具体内容如下 <!doctype html> <html> <head> <meta charset="utf-8"> <title>js动态时间显示 </title> </head> <body id = "show"> <script> function run(){ var time = ne

  • Javascript 世界时区时间显示代码

    Javascript 世界時間時間顯示 //https://gist.github.com/1326893https://gist.github.com/1326893 //20120511 Geovin Du 塗聚文 function calcTime(city, offset) { var d = new Date(); utc = d.getTime() + (d.getTimezoneOffset() * 60000); var nd = new Date(utc + (3600000

  • 纯JS实现动态时间显示代码

    复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title> <script language="javascript">

  • js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前

    js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前

    效果图: 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <ul> <li class="one-comment"> <a class="c-user-photo" href="&q

  • js获取当前时间显示在页面上并每秒刷新

    方法很简单,代码也很简洁,直接奉上代码吧 复制代码 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js获取当前时间显示在页面上</title> <script> window.onload=function(){ //定时器每秒调用一次fnDate() setInterval(f

  • JS 时间显示效果代码

    复制代码 代码如下: function settime() { var myyear,mymonth,myweek,myday,mytime,mymin,myhour,mysec; var mydate=new Date(); myyear=mydate.getFullYear(); mymonth=mydate.getMonth(); myday=mydate.getDate(); myhour=mydate.getHours(); mymin=mydate.getMinutes(); mys

  • js实现时间显示几天前、几小时前或者几分钟前的方法集锦

    这里汇总了js实现时间显示几天前.几小时前或者几分钟前的常见方法.分享给大家供大家参考.具体如下: 方法一: 个人做法是保存时间戳,然后在前端用jq插件做转换,比如 smart-time-ago 方法二: (通过freemarker模板)如果用freemarker模板可以这样写,别的模板类推 根据自己的意愿修改条件和输出,把你的datetime传进去即可 <#macro timeline_dt datetime=.now> <#assign ct = (.now?long-datetim

  • Javascript六种风格的时间显示方式

    12)?hrs-12:hrs); clckm=((min=12)?"下午":"上午"; var stnr=""; var ns="0123456789"; var a=""; function getFullYear(d) { yr=d.getYear();if(yr"); //下面各行分别是一种风格,把不需要的删掉即可 document.write("风格一:"+isnDay

  • javascript 时间显示代码集合(Date对象)

    javascript时间函数 javascript提供了Date对象来进行时间和日期的计算. Date对象有多种构造函数: new Date() //当前时间 new Date(milliseconds) //距离起始时间1970年1月1日的毫秒数 new Date(datestring) //字符串代表的日期与时间.此字符串可以使用Date.parse()转换,比如"Jannuary 1, 1998 20:13:15" new Date(year, month, day, hours

随机推荐