通过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 相关文章推荐
Javascript 获取字符串字节数的多种方法
Jun 02 Javascript
js onload处理html页面加载之后的事件
Oct 30 Javascript
图片翻转效果具体实现代码
Jan 09 Javascript
jQuery将所有被选中的checkbox某个属性值连接成字符串的方法
Jan 24 Javascript
简单谈谈json跨域
Mar 13 Javascript
Webpack的dll功能使用
Jun 28 Javascript
vue系列之requireJs中引入vue-router的方法
Jul 18 Javascript
JS canvas绘制五子棋的棋盘
May 28 Javascript
js中的数组对象排序分析
Dec 11 Javascript
使用jquery的cookie实现登录页记住用户名和密码的方法
Mar 13 jQuery
JavaScript使用ul中li标签实现删除效果
Apr 15 Javascript
原生jQuery实现只显示年份下拉框
Dec 24 jQuery
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
完美实现GIF动画缩略图的php代码
2011/01/02 PHP
PHP 面向对象程序设计(oop)学习笔记(一) - 抽象类、对象接口、instanceof 和契约式编程
2014/06/12 PHP
CI操作cookie的方法分析(基于helper类库)
2016/03/28 PHP
PHP性能优化大全(php.ini)
2016/05/20 PHP
php微信开发之带参数二维码的使用
2016/08/03 PHP
JS实现的省份级联实例代码
2013/06/24 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
2014/07/02 Javascript
node.js中的console.log方法使用说明
2014/12/09 Javascript
使用CSS+JavaScript或纯js实现半透明遮罩效果的实例分享
2016/05/09 Javascript
微信小程序 开发工具快捷键整理
2016/10/31 Javascript
简单实现js轮播图效果
2017/07/14 Javascript
vue.js使用v-if实现显示与隐藏功能示例
2018/07/06 Javascript
详解Vue CLI3配置之filenameHashing使用和源码设计使用和源码设计
2018/08/31 Javascript
JavaScript JSON数据处理全集(小结)
2019/08/15 Javascript
nodeJS与MySQL实现分页数据以及倒序数据
2020/06/05 NodeJs
[42:39]老党炸弹人试玩视频
2014/09/03 DOTA
Python闭包实现计数器的方法
2015/05/05 Python
Python中如何优雅的合并两个字典(dict)方法示例
2017/08/09 Python
python机器学习理论与实战(二)决策树
2018/01/19 Python
Python操作mongodb数据库的方法详解
2018/12/08 Python
vue常用指令代码实例总结
2020/03/16 Python
采用冷却技术的超自然舒适度:GhostBed床垫
2018/09/18 全球购物
时尚圣经:The Fashion Bible
2019/03/03 全球购物
吉尔德利巧克力公司:Ghirardelli Chocolate Company
2019/03/27 全球购物
aden + anais英国官网:美国婴儿贴身用品品牌
2019/09/08 全球购物
Ibatis中如何提高SQL Map的性能
2013/05/11 面试题
运动会通讯稿100字
2014/01/31 职场文书
个人查摆剖析材料
2014/02/04 职场文书
车队司机自我鉴定
2014/03/02 职场文书
单位工作证明
2014/10/07 职场文书
大学生入党自荐书
2015/03/05 职场文书
安全员岗位职责范本
2015/04/11 职场文书
2015年党总支工作总结
2015/05/25 职场文书
html+css 实现简易导航栏功能
2021/04/07 HTML / CSS
MySQL 8.0 Online DDL快速加列的相关总结
2021/06/02 MySQL
MySQL 亿级数据导入导出及迁移笔记
2021/06/18 MySQL