JavaScript实现数字时钟功能
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<center>
<body style="background: #4A4848;font-size: 30px;padding-top: 50px;">
<img src="data:images/0.png" />
<img src="data:images/0.png" />
:
<img src="data:images/0.png" />
<img src="data:images/0.png" />
:
<img src="data:images/0.png" />
<img src="data:images/0.png" />
<script>
function bijiao(n)
{
if(n<10)
{
return '0'+n;
}
else
{
return ''+n;
}
}
function tick()
{
var aimg=document.getElementsByTagName('img');
var odata= new Date();
var str=bijiao(odata.getHours())+bijiao(odata.getMinutes())+bijiao(odata.getSeconds());
for(var i=0;i<aimg.length;i++)
{
aimg[i].src='images/'+str.charAt(i)+'.png';
}
}
setInterval(tick,1000);
tick();
</script>
</body>
</center>
</html>
JavaScript实现数字时钟功能的更多相关文章
- 使用javascript实现的一些功能
原文:使用javascript实现的一些功能 今天学习了javascript中的事件,已经接近尾声,可以说明天跨入jquery的学习啦,学习了一周的javascript,感觉还没有掌握其中学习的微妙之 ...
- 基于Verilog HDL 的数字时钟设计
基于Verilog HDL的数字时钟设计 一.实验内容: 利用FPGA实现数字时钟设计,附带秒表功能及时间设置功能.时间设置由开关S1和S2控制,分别是增和减.开关S3是模式选择:0是正常时钟 ...
- HandlerThread实现数字时钟
1.描述 刚看完Android多线程编程,对HandlerThread比较感兴趣,趁热巩固练习,实现一个了数字时钟,希望对学习HandlerThread有所帮助.如下: 启动一个HandlerThre ...
- js动态数字时钟
js动态数字时钟 主要用到知识点: 主要是通过数组的一些方法,如:Array.from() Array.reduce() Array.find() 时间的处理和渲染 js用到面向对象的写法 实现的功能 ...
- canvas :原生javascript编写动态时钟
canvas :原生javascript编写动态时钟 此时针是以画布的中心为圆心: g.translate(width/2,width/2); 此函数是将画布的原点移到(width/2,wid ...
- 【ARM】2440裸机系列-RTC数字时钟
功能 裸机程序,实现LCD显示数字时钟 主要代码 1)背景绘制 void Brush_ U32 c) { int x,y ; for ( y = 0 ; y < LCD_HEIGHT ; y ...
- js实现动态数字时钟
1.效果如下 2.html部分 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"&g ...
- html5 canvas js(数字时钟)
<!doctype html> <html> <head> <title>canvas dClock</title> </head ...
- JS — 实现简单的数字时钟
js实现简单的数字时钟 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
随机推荐
- Django—链接MySQL
Djalgo基础配置方法 静态文件配置方法 1 所有的静态文件都放在 static 文件夹下,例如Bootstrap值类的第三方库,通常 static 文件下会创建 css image js 文件,用 ...
- vue 导航菜单默认子路由
export default new Router({ routes: [ { path: '/', name: 'index', component: index, children: [ { pa ...
- 04-Linux系统编程-第01天(文件IO、阻塞非阻塞)
03-系统函数 系统编程章节大纲 1 文件I/O 2 文件系统 3 进程 4 进程间通信 5 信号 6 进程间关系 7 守护进程 8 线程 9 线程同步 10 网络基础 11 socket编程 12 ...
- [poj3565] Ants (二分图带权匹配)
传送门 Description 年轻自然主义者比尔在学校研究蚂蚁. 他的蚂蚁以苹果树上苹果为食. 每个蚁群都需要自己的苹果树来养活自己. 比尔有一张坐标为 n 个蚁群和 n 棵苹果树的地图. 他知道蚂 ...
- python项目开发:ftp server开发
程序要求: 1.用户加密认证 (对用户名密码进行MD5验证)2.允许同时多用户登陆 (使用socket server方法,为每个用户都创建一个信息文件)3.每个用户有自己的家目录,且只能访问自己的家目 ...
- matplotlib的annotate用法小结
这个是matplotlib自定义的annotate方法的文本: 一. def annotate(self, s, xy, *args, **kwargs): a = mtext.Annotation( ...
- elasticsearch 分析器阅读笔记(五)
倒排索引 可以查看这里得分词原理https://www.cnblogs.com/LQBlog/articles/5743991.html 分析器 分析器处理过程的3步骤 1.字符过滤器:去除字符的特殊 ...
- nyoj 711 枚举+并查集
#include<stdio.h>//从大到小不断枚举边直到找到s-t的路径,判断从s可以到t可以用并查集来判断 #include<stdlib.h>//枚举最大的一条边肯定 ...
- navicat 为表添加索引
navicat 为表添加索引 分析常用的查询场景,为字段添加索引,增加查询速度. 可以添加单列索引,可以添加联合索引. 右键,设计表中可以查看和添加修改索引! 索引一定要根据常用的查询场景进行添加! ...
- Official Documents
1. Docker Installation https://docs.docker.com/install/linux/docker-ee/suse/ 2. Docker hub https://d ...