通过js控制时间,一秒一秒自己动的实例


Posted in Javascript onOctober 25, 2017

1、第一种形式

<html>
 <head>
 <title>时间</title>
 <script type="text/javascript">
setInterval("showtime()", 1000);
function showtime() {
var date = new Date();
var time = date.getHours() + ":" + date.getMinutes() + ":"
+ date.getSeconds();
document.getElementById("timeBox").value = time;
}
</script>
 </head>
 <body>
 <div style="text-align:center;">
  当前时间:<input type="text" name="timeBox" id="time" />
 </div>
 </body>
</html>

2、第二种形式

<html>
 <head>
 <title>时间</title>
 <script type="text/javascript">
 //获得当前时间,刻度为一千分一秒 
 function showLeftTime() {  
 var now = new Date();  
 var year = now.getFullYear();  
 var month = now.getMonth() + 1;  
 var day = now.getDate();  
 var hours = now.getHours();  
 var minutes = now.getMinutes();  
 var seconds = now.getSeconds();  
 document.all.show.innerHTML = "" + year + "年" + month + "月" + day + "日</br> " + hours + ":" + minutes + ":" + seconds + ""; 
 //document.getElementById("show").innerHTML = "" + year + "年" + month + "月" + day + "日</br> " + hours + ":" + minutes + ":" + seconds + "";  
  
 //一秒刷新一次显示时间 
 setTimeout(showLeftTime, 1000); 
 } 
 
 </script> 
 </head>
 <body onload="showLeftTime()">
 <label id="show"></label><br/>
 <!-- <script type="text/javaScript">
 showLeftTime();
 </script> -->
 </body>
</html>

以上这篇通过js控制时间,一秒一秒自己动的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于JQuery的类似新浪微博展示信息效果的代码
Jul 23 Javascript
ExtJs纵坐标值重复问题的解决方法
Feb 27 Javascript
JavaScript中检查对象property的存在性方法介绍
Dec 30 Javascript
JS实现的鼠标跟随代码(卡通手型点击效果)
Oct 26 Javascript
Jquery左右滑动插件之实现超级炫酷动画效果附源码下载
Dec 02 Javascript
BOM系列第二篇之定时器requestAnimationFrame
Aug 17 Javascript
使用Vue开发一个实时性时间转换指令
Jan 17 Javascript
说说如何在Vue.js中实现数字输入组件的方法
Jan 08 Javascript
JavaScript Tab菜单实现过程解析
May 13 Javascript
toString.call()通用的判断数据类型方法示例
Aug 28 Javascript
Vue.js桌面端自定义滚动条组件之美化滚动条VScroll
Dec 01 Vue.js
详解JS数组方法
Nov 20 Javascript
js 显示日期时间的实例(时间过一秒加1)
Oct 25 #Javascript
JavaScript编程设计模式之观察者模式(Observer Pattern)实例详解
Oct 25 #Javascript
BootStrap 标题设置跨行无效的解决方法
Oct 25 #Javascript
vue基于mint-ui的城市选择3级联动的示例
Oct 25 #Javascript
浅谈Vue的加载顺序探讨
Oct 25 #Javascript
JavaScript模块模式实例详解
Oct 25 #Javascript
vue生成token保存在客户端localStorage中的方法
Oct 25 #Javascript
You might like
php带密码功能并下载远程文件保存本地指定目录 修改加强版
2010/05/16 PHP
PHP写的资源下载防盗链类分享
2014/05/12 PHP
PHP延迟静态绑定示例分享
2014/06/22 PHP
php实现读取超大文件的方法
2014/07/28 PHP
php使用Jpgraph绘制简单X-Y坐标图的方法
2015/06/10 PHP
Symfony模板的快捷变量用法实例
2016/03/17 PHP
PHP5.4起内置web服务器使用方法
2016/08/09 PHP
Yii2语言国际化自动配置详解
2018/08/22 PHP
js 多种变量定义(对象直接量,数组直接量和函数直接量)
2010/05/24 Javascript
javascript面向对象编程代码
2011/12/19 Javascript
浅析jquery的作用与优势
2013/12/02 Javascript
javascript文件中引用依赖的js文件的方法
2014/03/17 Javascript
网页运行时提示对象不支持abigimage属性或方法
2014/08/10 Javascript
用js传递value默认值的示例代码
2014/09/11 Javascript
jQuery实现多按钮单击变色
2014/11/27 Javascript
手机图片预览插件photoswipe.js使用总结
2016/08/25 Javascript
浅谈js数据类型判断与数组判断
2016/08/29 Javascript
微信小程序-getUserInfo回调的实例详解
2017/10/27 Javascript
深入理解requireJS-实现一个简单的模块加载器
2018/01/15 Javascript
jquery实现垂直无限轮播的方法分析
2019/07/16 jQuery
react基本安装与测试示例
2020/04/27 Javascript
基于Vue CSR的微前端实现方案实践
2020/05/27 Javascript
Vue中避免滥用this去读取data中数据
2021/03/02 Vue.js
[01:46]2020完美世界全国高校联赛秋季赛报名开启
2020/10/15 DOTA
Python实现的一个简单LRU cache
2014/09/26 Python
Python中计算三角函数之cos()方法的使用简介
2015/05/15 Python
python tensorflow学习之识别单张图片的实现的示例
2018/02/09 Python
Python键盘输入转换为列表的实例
2018/06/23 Python
使用Python创建简单的HTTP服务器的方法步骤
2019/04/26 Python
通过python改变图片特定区域的颜色详解
2019/07/15 Python
把vgg-face.mat权重迁移到pytorch模型示例
2019/12/27 Python
pytorch 实现在一个优化器中设置多个网络参数的例子
2020/02/20 Python
three.js模拟实现太阳系行星体系功能
2019/09/03 HTML / CSS
推普周国旗下讲话稿
2014/09/21 职场文书
同学聚会邀请函
2015/01/30 职场文书
人事行政部各岗位职责说明书!
2019/07/15 职场文书