通过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 模拟用户点击超链接或者按钮的方法
Oct 25 Javascript
jquery中show()、hide()和toggle()用法实例
Jan 15 Javascript
javascript搜索框效果实现方法
May 14 Javascript
javascript实现获取服务器时间
May 19 Javascript
jQuery使用$获取对象后检查该对象是否存在的实现方法
Sep 04 Javascript
用jQuery实现圆点图片轮播效果
Mar 19 Javascript
详解如何将angular-ui的图片轮播组件封装成一个指令
May 09 Javascript
vue checkbox 全选 数据的绑定及获取和计算方法
Feb 09 Javascript
angularJs中$scope数据序列化的实例
Sep 30 Javascript
使用JS判断页面是首次被加载还是刷新
May 26 Javascript
openLayer4实现动态改变标注图标
Aug 17 Javascript
vue 使用 v-model 双向绑定父子组件的值遇见的问题及解决方案
Mar 01 Vue.js
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输出英文时间日期的安全方法(RFC 1123格式)
2014/06/13 PHP
PHP获取客户端及服务器端IP的封装类
2016/07/21 PHP
[原创]PHP获取数组表示的路径方法分析【数组转字符串】
2017/09/01 PHP
PHP全局使用Laravel辅助函数dd
2019/12/26 PHP
javascript 常用方法总结
2009/06/03 Javascript
javascript+iframe 实现无刷新载入整页的代码
2010/03/17 Javascript
javascript 通用简单的table选项卡实现
2010/05/07 Javascript
jQuery 选择器、DOM操作、事件、动画
2010/11/25 Javascript
jQuery easyui datagrid动态查询数据实例讲解
2013/02/26 Javascript
javascript生成json数据简单示例分享
2014/02/14 Javascript
jquery实现手机号码选号的方法
2015/07/31 Javascript
Bootstrap每天必学之工具提示(Tooltip)插件
2016/04/26 Javascript
只需五句话搞定JavaScript作用域(经典)
2016/07/26 Javascript
js实现加载更多功能实例
2016/10/27 Javascript
JS前端笔试题分析
2016/12/19 Javascript
vue登录注册实例详解
2019/09/14 Javascript
JS插件amCharts实现绘制柱形图默认显示数值功能示例
2019/11/26 Javascript
vue-cli3项目打包后自动化部署到服务器的方法
2020/09/16 Javascript
[32:56]完美世界DOTA2联赛PWL S3 Rebirth vs CPG 第二场 12.11
2020/12/16 DOTA
Python实现批量将word转html并将html内容发布至网站的方法
2015/07/14 Python
Python设计模式之工厂模式简单示例
2018/01/09 Python
Python基于TCP实现会聊天的小机器人功能示例
2018/04/09 Python
在Python中使用defaultdict初始化字典以及应用方法
2018/10/31 Python
详解python数据结构和算法
2019/04/18 Python
Django框架教程之中间件MiddleWare浅析
2019/12/29 Python
python爬虫开发之urllib模块详细使用方法与实例全解
2020/03/09 Python
python实现登录与注册系统
2020/11/30 Python
详解numpy1.19.4与python3.9版本冲突解决
2020/12/15 Python
python opencv肤色检测的实现示例
2020/12/21 Python
某/etc/fstab文件中的某行如下: /dev/had5 /mnt/dosdata msdos defaults,usrquota 1 2 请解释其含义
2013/04/11 面试题
财务管理专业毕业生求职信
2014/06/02 职场文书
文案策划专业自荐信
2014/07/07 职场文书
2015年护士工作总结范文
2015/03/31 职场文书
MySql存储过程之逻辑判断和条件控制
2021/05/26 MySQL
golang 实用库gotable的具体使用
2021/07/01 Golang
java协程框架quasar和kotlin中的协程对比分析
2022/02/24 Java/Android