通过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 相关文章推荐
input 高级限制级用法
Mar 26 Javascript
推荐17个优美新鲜的jQuery的工具提示插件
Sep 14 Javascript
node.js中的fs.writeFile方法使用说明
Dec 14 Javascript
jQuery实现数字加减效果汇总
Dec 16 Javascript
深入理解JavaScript系列(33):设计模式之策略模式详解
Mar 03 Javascript
jQuery实现类似淘宝网图片放大效果的方法
Jul 08 Javascript
javascript加减乘除的简单实例
Jul 12 Javascript
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
Jun 26 jQuery
vue二级路由设置方法
Feb 09 Javascript
vue实现a标签点击高亮方法
Mar 17 Javascript
JavaScript 中的12种循环遍历方法【总结】
May 31 Javascript
详解vue中localStorage的使用方法
Nov 22 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
smarty巧妙处理iframe中内容页的代码
2012/03/07 PHP
解析PHP 使用curl提交json格式数据
2013/06/29 PHP
php修改NetBeans默认字体的大小
2013/07/02 PHP
php实现文本数据导入SQL SERVER
2015/05/17 PHP
PHP读取mssql json数据中文乱码的解决办法
2016/04/11 PHP
js简单的表格添加行和删除行操作示例
2014/03/31 Javascript
js 采用delete实现继承示例代码
2014/05/20 Javascript
bootstrap data与jquery .data
2014/07/07 Javascript
js实现同一页面多个不同运动效果的方法
2015/04/10 Javascript
原生js实现可拖动的登录框效果
2017/01/21 Javascript
微信小程序 input输入及动态设置按钮的实现
2017/10/27 Javascript
Angular使用过滤器uppercase/lowercase实现字母大小写转换功能示例
2018/03/27 Javascript
Javascript操作select控件代码实例
2020/02/14 Javascript
小程序websocket心跳库(websocket-heartbeat-miniprogram)
2020/02/23 Javascript
vue中v-for循环选中点击的元素并对该元素添加样式操作
2020/07/17 Javascript
python实现模拟按键,自动翻页看u17漫画
2015/03/17 Python
在Python中利用Into包整洁地进行数据迁移的教程
2015/03/30 Python
Python新手在作用域方面经常容易碰到的问题
2015/04/03 Python
深入了解Python数据类型之列表
2016/06/24 Python
Python实现字符串反转的常用方法分析【4种方法】
2017/09/30 Python
详解django中url路由配置及渲染方式
2019/02/25 Python
Django项目创建到启动详解(最全最详细)
2019/09/07 Python
Python从列表推导到zip()函数的5种技巧总结
2019/10/23 Python
Python定义一个函数的方法
2020/06/15 Python
解决Python安装cryptography报错问题
2020/09/03 Python
Django Admin后台模型列表页面如何添加自定义操作按钮
2020/11/11 Python
Python Socket多线程并发原理及实现
2020/12/11 Python
CSS3 重置iphone浏览器按钮input,select等表单元素的默认样式
2014/10/11 HTML / CSS
Chemist Warehouse中文网:澳洲连锁大药房
2021/02/05 全球购物
山海经纬软件测试笔试题和面试题
2013/04/02 面试题
爱晚亭导游词
2015/02/09 职场文书
留学推荐信英文范文
2015/03/26 职场文书
小学推普周活动总结
2015/05/07 职场文书
保险公司岗前培训工作总结
2015/10/24 职场文书
Mysql MVCC机制原理详解
2021/04/20 MySQL
Vue实现动态查询规则生成组件
2021/05/27 Vue.js