js实现在网页上简单显示时间的方法

本文实例讲述了js实现在网页上简单显示时间的方法。分享给大家供大家参考。具体如下:

这是一款网页时钟JS代码,纯javascript实现,显示时、分、秒。网页时间显示、网页时钟有很多,这个真的挺简易的,美工好的朋友可在此基础上进一步美化完善

复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>简易网页时钟</title>
<style>
body,div{margin:0;padding:0;}
body{color:#fff;font:16px/1.5 \5fae\8f6f\96c5\9ed1;}
#clock{width:300px;text-align:center;background:#1a1a1a;margin:10px auto;padding:20px 0;}
span{color:#000;width:80px;line-height:2;background:#fbfbfb;border:2px solid #b4b4b4;margin:0 10px;padding:0 10px;}
</style>
<script>
window.onload = function ()
{
var oClock = document.getElementById("clock");
var aSpan = oClock.getElementsByTagName("span");
setInterval(getTimes, 1000);
getTimes();
function getTimes ()
{
var oDate = new Date();
var aDate = [oDate.getHours(), oDate.getMinutes(), oDate.getSeconds()];
for (var i in aDate) aSpan[i].innerHTML = format(aDate[i])
}
function format(a)
{
return a.toString().replace(/^(\d)$/, "0$1")
}
}
</script>
</head>
<body>
<div id="clock">
<span></span>点<span></span>分<span></span>秒
</div>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

时间: 2015-02-28

JS小功能(setInterval实现图片效果显示时间)实例代码

效果: 代码: 复制代码 代码如下: <head runat="server">    <title></title>    <script type="text/javascript">        function toDou(n) {            if (n < 10) {                return '0' + n;            }            else {

一个php+js实时显示时间问题

我们先来看下这段代码 $(function(){ setInterval(function(){ var timer = '<?php echo date("Y-m-d H:i:s",time()) ?>'; $("#test").append(timer); },500); }); 这段代码哪里有问题,为啥网页加载后网页一直是那个时间不会变呢?php和js的加载机制有啥不同? 这样是不对的,php代码在输出前被解释,浏览器收到的代码应该是这个样子的 $

asp.net转出json格式客户端显示时间

在服务器端利用 JavaScriptSerializer serializer = new JavaScriptSerializer(); return serializer.Serialize(obj); 对对像序列化, 对于时间类型得出结果为:\/Date(1216796600500)\/ 客户端解析的方式为: 复制代码 代码如下: function renderTime(data){ var da = eval('new ' + data.replace('/','','g').repla

js+数组实现网页上显示时间/星期几的实用方法

复制代码 代码如下: <html> <head> <script type="text/javascript"> function startTime() { var today=new Date() var h=today.getHours() var m=today.getMinutes() var s=today.getSeconds() // add a zero in front of numbers<10 m=checkTime(m

js显示时间 js显示最后修改时间

本实例将实现显示网页文件最后的修改时间.首先在页面添加了一个文本框控件,然后使用javascript创建了一个函数,在函数中调用document对象的lastModified属性,然后在页面的文本框中显示文件上一次被修改的时间,通过这种方法可以查看网页的更新时间. 实现过程: 1.编写自定义函数,代码如下: 复制代码 代码如下: <script language="javascript"> function alterdate() { document.form1.text

JavaScript获取当前网页最后修改时间的方法

本文实例讲述了JavaScript获取当前网页最后修改时间的方法.分享给大家供大家参考.具体如下: 下面的JS代码输出当前网页最后修改时间,用到了document.lastModified属性 <!DOCTYPE html> <html> <body> This document was last modified on: <script> document.write(document.lastModified); </script> <

Linux 判断文件修改时间和系统时间差

 Linux 判断文件修改时间和系统时间差 #!/bin/bash timestamp=`date +%s` filepath=/root/yuhui/ta-2016030307.log if [ -f $filepath ]; then echo "文件存在!路径为:$filepath" filetimestamp=`stat -c %Y $filepath` echo "文件最后修改时间戳:$filetimestamp" timecha=$[$timestamp

Android基于名称、修改时间、大小实现文件夹排序

本文实例为大家分享了Android实现文件夹排序的具体代码,供大家参考,具体内容如下 基于名称: /** * 按文件名排序 * @param filePath */ public static ArrayList<String> orderByName(String filePath) { ArrayList<String> FileNameList = new ArrayList<String>(); File file = new File(filePath); F

基于JS代码实现实时显示系统时间

1.概述 在浏览很多网站时,都会发现在网站中加入了显示当前系统时间的功能,在网页中显示当前系统时间,不仅可以方便浏览者掌握当前时间,而且还美化了网页. 2.技术要点 利用Date对象来实现.首先创建一个表示当前系统时间的Date()对象,然后通过Date对象的getXxx()方法获得当前系统时间的年.月.日.小时.分.秒和星期的值,接下来将获得的这些值组合成一个日期时间字符串,并将日期时间字符串设置成为<div>标签的内容,最后通过window对象的setTimeout()函数每隔1秒调用一个

js实时获取并显示当前时间的方法

本文实例讲述了js实时获取并显示当前时间的方法.分享给大家供大家参考.具体实现方法如下: js部分如下: <script type="text/javascript"> window.onload = function() { var show = document.getElementById("show"); setInterval(function() { var time = new Date(); // 程序计时的月从0开始取值后+1 var

js实现Form栏显示全格式时间时钟效果代码

本文实例讲述了js实现Form栏显示全格式时间时钟效果代码.分享给大家供大家参考.具体如下: 这里演示的Form栏特效时钟,显示全日期格式的时间日期效果,可显示星期几.几月几号,以往都是直接显示在网页中,而本代码是将时间显示在表单的文本框中,看一下代码就明白了. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-form-input-showtime-codes/ 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3

JS简单获取及显示当前时间的方法

本文实例讲述了JS简单获取及显示当前时间的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>当前时间</

JS实现浏览器状态栏显示时间的方法

本文实例讲述了JS实现浏览器状态栏显示时间的方法.分享给大家供大家参考,具体如下: 以前做个人主页的时候,总喜欢把自己的网页搞的很个性,在网上做跑马灯文字,在状态栏显示问候语,或者在状态栏添加时间显示,本代码就是实现了状态栏显示当前时间的物资,火狐没测度,IE下效果完美. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-status-bar-show-time-demo/ 具体代码如下: <!DOCTYPE HTML PUBLIC "

js按指定格式显示日期时间的样式代码

/// /// 格式化显示日期时间 /// /// 待显示的日期时间,例如new Date() /// 需要显示的格式,例如yyyy-MM-dd hh:mm:ss function date2str(x,y) { var z = {M:x.getMonth()+1,d:x.getDate(),h:x.getHours(),m:x.getMinutes(),s:x.getSeconds()}; y = y.replace(/(M+|d+|h+|m+|s+)/g,function(v) {retur