JAVAScript的时间效果
来源:互联网 发布:coc五级龙数据 编辑:程序博客网 时间:2024/05/21 09:31
1.显示当前时间:xx:xx:xx pm/am
<body onload="showtime()">
<div>当前时间:<span id="clock"></span ></div>
<script type="application/javascript">
function showtime()//创建函数
{var nowTime = new Date();//创建时间对象实例
var hours = nowTime.getHours();//获取当前小时数
var minutes = nowTime.getMinutes();//获取当前分钟数
var seconds = nowTime.getSeconds();//获取当前秒数
var timer = " "+((hours>12)?hours-12:hours);//将小时数质赋予变量timer
timer +=((minutes<10)?"0:":":")+minutes;//将分钟数值赋予变量timer
timer += ((seconds<10)?"0:":":")+seconds;//将秒数值赋予变量timer
timer +=" "+((hours>12)?"pm":"am");//将字符am或pm赋予变量timer
document.getElementById('clock').innerHTML =timer;
setTimeout("showtime()",1000);
}
</script>
</body>
2.显示XXXX年XX月XX日 星期XX
<body onload="initArray()">
<div> <span id="todayIs"></span></div>
<script type="application/javascript">
function initArray()
{
var today = new Date();
var d = new Array(
"星期日","星期一","星期二","星期三","星期四","星期五","星期六")
//如果为2014年,getYear返回2014-1900=114,getFullYear返回2014
var hh="<font color='#FBAE66' style='font-size:9pt;font-family:宋体'>今天是: "+
today.getFullYear()+"年"+(today.getMonth()+1)+"月"+today.getDate()+"日 "+d[today.getDay()]+"</font>";
document.getElementById('todayIs').innerHTML = hh;
}
</script>
</body>
3.显示页面停留时间
<body>
<div>当前页面停留时间:<span id="yy004" >0时0分0秒</span></div>
<script type="text/javascript">
var sec =0;
var minu=0;
var hou=0;
//每隔一秒刷新一次
window.setTimeout("uupdate()",1000);
function uupdate()
{
sec++;
if(sec==60)
{
sec =0;
minu +=1;
}
if(minu==60)
{
minu=0;
hou+=1;
}
var ss04 =hou+ "时"+minu+"分"+sec+"秒";
document.getElementById('yy004').innerHTML=ss04;
window.setTimeout("uupdate()",1000);
}
</script>
</body>
4.倒计时
<body>
<div id="yy005"></div>
<script type="application/javascript">
var nowDay = new Date();
var yyear = nowDay.getFullYear()+1;
var timeDate = new Date(yyear+"-01-01");
var date = timeDate.getTime()-nowDay.getTime();//获取剩余时间
//将剩余时间转换为剩余天数
var time = Math.floor(date/(1000*60*60*24));
var show005="";
if(time>=0)
{
show005 = "现在离"+yyear+"年元旦还有:<font color='red'><b>"+time+"</b></font>天";
document.getElementById('yy005').innerHTML=show005;
}
</script></body>
5.时间显示XXXX年XX月XX日 星期xx XX:XX:XX
var myvar=setInterval(function(){myTimer()},1000);
function myTimer(){
var d=new Date();
var myArray = new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");
var y=d.getFullYear();
var M=d.getUTCMonth();
var D=d.getDate();
var t=d.toLocaleTimeString();
var weekday=d.getDay();
if (weekday==0 | weekday==6)
{
document.getElementById("N2").innerHTML=y+"年"+(M+1)+"月"+D+"日"+"\n"+ myArray[weekday]+" "+t;
}
else
{
document.getElementById("N2").innerHTML=y+"年"+(M+1)+"月"+D+"日"+ myArray[weekday]+" "+t;} }
6.发送验证码倒计时
var countdown=60;
function settime(Obj){
if(checkName()&&checkPwd()){
var userName=$("#userAccount").val();
var password=$("#userPwd").val();
if(countdown==0){
Obj.removeAttribute("disabled");
Obj.value="获取验证码";
countdown=60;
return false;
}else{
if(countdown==59){
loginBefore();
}
Obj.setAttribute("disabled",true);
Obj.value="重新发送("+countdown+")";
--countdown;
}
setTimeout(function(){settime(Obj)},1000);
}
}
- JAVAScript的时间效果
- javascript中获取时间效果
- javascript时间自行走效果
- 第一章 JavaScript日期时间效果--数字时间
- 第一章 JavaScript日期时间效果--日期星期
- 第一章 JavaScript日期时间效果--倒计时
- 第一章 JavaScript日期时间效果--定时器
- 第一章 JavaScript日期时间效果--日期控件
- javascript学习(二) 时间效果实现
- Javascript实践之时间显示效果
- 有趣的javascript效果
- 有趣的javascript效果
- 经典的JavaScript效果
- 第一章 JavaScript日期时间效果--显示停留时间
- Javascript的时间验证
- javascript的时间函数
- javascript 时间的比较
- javascript的时间事件
- C
- Qt常用类(2) —— QChar类
- D
- 徽章系列2:JitPack 的使用
- Radan 的Mrp导入加工清单功能
- JAVAScript的时间效果
- BFS与双向BFS Knight Moves(经典棋盘问题!!!)
- 类的组成部分
- 欢迎使用CSDN-markdown编辑器
- 淘咖啡:阿里无人咖啡馆效果图
- 文件数据输入输出流对象的简单应用(DataOutputStream和DateInputStream)
- 徽章系列1: Top 30 android 开源项目徽章
- 爬取新浪国内新闻首页
- 拓扑排序 详解 + 并查集 详解 + 最小生成树(MST)详解 【普利姆算法 + 优先队列优化 & 克鲁斯卡尔算法】