js 简易时钟
html部分
<div id="clock">
</div>
css部分
#clock{
width:600px ;
text-align: center;
margin:50px auto ;
}
span{
font-size: 32px;
}
js部分
<script type="text/javascript">
function getId(id){ //id传入的是字符串
return document.getElementById(id);
};
function myDate(){
var myDate=new Date();
var y=myDate.getFullYear();
var m=myDate.getMonth()+1;
var r=myDate.getDate();
var h=myDate.getHours();
var f=myDate.getMinutes();
var s=myDate.getSeconds();
var clockDiv=getId('clock');
clockDiv.innerHTML="<div><span>"+y+"年</span><span>"+m+"月</span><span>"+r+"日</span></div><div><span>"+h+"时</span><span>"+f+"分</span><span>"+s+"秒</span></div>";
}
window.onload=function(){
setInterval(myDate,1000)
myDate();
}
</script>
js 简易时钟的更多相关文章
- JS简易时钟
HTML <div id="clock"> <span></span>:<span></span>:<span&g ...
- marked.js简易手册
marked.js简易手册 本文介绍的是marked.js.秉持"来之即用"的原则,对它进行简要的翻译和归纳, 安装 在网上引用或者是引用本地文件即可.要么就用命令行: npm i ...
- js简易日历
js简易日历中设计的知识点:选项卡切换 数组 innerHTML 连接符 与选项卡的区别:div的个数不同 连接符中需要注意的:(优先级) "abc"+12+3+&qu ...
- js 动态时钟
js 动态时钟 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...
- JS实现时钟特效
<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"& ...
- 用canvas绘制一个简易时钟
在见识了html5中canvas的强大,笔者准备制作一个简易时钟. 下面就是成果啦,制作之前我们先分析一下,绘制一个时钟需要做哪些准备. 一 . 1.首先这个时钟分为表盘,指针(时针,分针,秒针)和数 ...
- 通过Canvas + JS 实现简易时钟实战
最近通过各种渠道学习了下html5中的canvas元素,为了练练手就随手写了一个简易的时钟.时钟本身不复杂,没有使用图片进行美化,下面就与大家分享一下具体的代码: 这是最终实现的效果: 部分的启发点来 ...
- canvas绘制简易时钟
时钟绘制的非常简易,但该有的都有了. 效果图如下, <!DOCTYPE html> <html> <head lang="en"> <me ...
- JS 做时钟
今天,给大家分享一个用JS做的时钟. <!DOCTYPE html><html> <head> <meta charset="utf-8" ...
随机推荐
- vue/cli 3.0 font-size随屏幕大小变化而变化 rem设置
在安装cube-ui框架时 安装成功后在[E:\WWW\xxx\node_modules\vue-cli-plugin-cube-ui\generator\rem\index.js]修改remUnit ...
- Python开发【项目】:选课系统-改良版
程序名称: 选课系统 角色:学校.学员.课程.讲师要求:1. 创建北京.上海 2 所学校2. 创建linux , python , go 3个课程 , linux\py 在北京开, go 在上海开3. ...
- [django]http请求
请求参数 http基本认证 https://zxc0328.github.io/2015/11/04/http-basic-auth/ 我们看到在http请求的header里有一个Authorizat ...
- 使用Python监控Linux系统
一.Python编写的监控工具 一.多功能系统资源统计工具dstat 1.dstat介绍 dstat是一个用Python语言实现的多功能系统资源统计工具,用来取代Linux下的vmstat.iosta ...
- (转)Springboot邮件服务
springboot仍然在狂速发展,才五个多月没有关注,现在看官网已经到1.5.3.RELEASE版本了.准备慢慢在写写springboot相关的文章,本篇文章使用springboot最新版本1.5. ...
- vue--项目文件
build config:webpack的配置文件 node_modules: 依赖的npm包 src: 项目代码 static:依赖的第三方库 ps:static中有个文件.gitkeep 因为新建 ...
- WebAssembly 浏览器中运行c/c++模块
今天,要给前端造点儿福利 浏览器中能调用javascript,曾经我们以为够用了,够强大了,但是事实上是完全不够 还好,mozilla的工程师提出了webassembly,目前是利用emsctript ...
- linux du查看文件所占大小
Linux du命令也是查看使用空间的,但是与df命令不同的是Linux du命令是对文件和目录磁盘使用的空间的查看,还是和df命令有一些区别的. 1.命令格式: du [选项][文件] 2.命令功能 ...
- C# 图片 旋转和翻转 RotateFlip
1.Rotate90FlipX2.Rotate90FliY3.Rotate90FlipXY4.Rotate90FlipNone以上面四个为例:1是指定后接水平翻转的90度顺时针旋转,2是指定后接垂直翻 ...
- c# Mongodb创建自增列
MongoCollection<BsonDocument> tblCount; if (!db.CollectionExists(tblCountName)) { ...