<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title>
简单的日历
</title>
</head>
<style rel="stylesheet" type="text/css">
.td_xq{ text-align:center; font-size:12px; font-weight:bold; } .td_hao{
font-size:12px; cursor:pointer; width:20px; height:20px; text-align:center;
}
</style>

<body>
<div id="scs_rl">
</div>
<SCRIPT LANGUAGE="JavaScript">
function fDrawCal(y, m) {
var temp_d = new Date(y, m - 1, 1);
var first_d = temp_d.getDay(); //返回本月1号是星期几
temp_d = new Date(y, m, 0);
var all_d = temp_d.getDate(); //返回本月共有多少天,同时避免复杂的判断润年不润年
var html, i_d;
html = y + "年" + m + "月" + d_d + "日";
html += "<table border='1' cellpadding='0' cellspacing='1' bgcolor='#ffffff'><tr>"html += "<td class='td_xq'>日</td>";
html += "<td class='td_xq'>一</td>";
html += "<td class='td_xq'>二</td>";
html += "<td class='td_xq'>三</td>";
html += "<td class='td_xq'>四</td>";
html += "<td class='td_xq'>五</td>";
html += "<td class='td_xq'>六</td></tr>";
html += "<tr>";
for (var i = 1; i <= 42; i++) {
if (first_d < i && i <= (all_d + first_d)) {
i_d = i - first_d; //显示出几号
html += "<td class='td_hao' onclick='show(this)'";
if (y == d_y && m == d_m && d_d == i_d) { //日历中为当天
html += " style='color:red'>" + i_d + "</td>";
} else {
html += ">" + i_d + "</td>";
}
} else {
html += "<td>&nbsp;</td>";
}
if (i % 7 == 0 && i < 42) {
html += "</tr><tr>";
}
}
html += "</tr></table>";
document.getElementById("scs_rl").innerHTML = html;
}

//点击函数
function show(obj) {
var t = obj.innerHTML;
//点击后获取时间,如果日历在月视图中不作为,如果在日视图对应跳到对应的日期,如果是在周视图视情况判断
alert(t);
}

var d_Date = new Date(); //系统时间对象
var d_y = d_Date.getFullYear(); //完整的年份,千万不要使用getYear,firfox不支持
var d_m = d_Date.getMonth() + 1; //注意获取的月份比实现的小1
var d_d = d_Date.getDate();
fDrawCal(d_y, d_m);
</script>

<body>

</html>

var dd = new Date();
dd.setDate(dd.getDate()+AddDayCount);
设置某天的出初始值

var d = new Date();

//先要存起来

d.setHours(0, 0, 0, 0);

console.log(d);

new Date(2018, 2, 0).getDate(); 这种语法算的是当月总共多少天 不用月份减一,日期设为零了
new Date(2018, 2, 1).getDay();得出0-6返回周几 0为周日 算的是三月份，日期没设为零，月份从零开始算起，所以算的是三月份

var oDate = new Date(); //实例一个时间对象；
oDate.getFullYear(); //获取系统的年；
oDate.getMonth()+1; //获取系统月份，由于月份是从0开始计算，所以要加1
oDate.getDate(); // 获取系统日，
oDate.getHours(); //获取系统时，
oDate.getMinutes(); //分
oDate.getSeconds(); //秒

简单日历dom的更多相关文章

  1. JS写一个简单日历

    JS写一个日历,配合jQuery操作DOM <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...

  2. js编写当天简单日历

    之前一直很想用javascript写一个日历,但是因为完全没有好的思路, 所以迟迟没有尝试.最近在网上刚好看到用javascript编写的简单日历的例子,代码量虽然不大, 但是我觉得很好地阐述了js日 ...

  3. js超简单日历

    用原生js写了一个超级简单的日历.当做是练习js中的Date类型. 思路: 获取某个日期,根据年份计算出每个月的天数. 利用Date中的getDay()知道该月份的第一天为星期几. 循环创建表格,显示 ...

  4. 【UI插件】开发一个简单日历插件（上）

    前言 最近开始整理我们的单页应用框架了,虽然可能比不上MVVM模式的开发效率,也可能没有Backbone框架模块清晰,但是好歹也是自己开发出来 而且也用于了这么多频道的东西,如果没有总结,没有整理,没 ...

  5. 都别说工资低了，我们来一起写简单的dom选择器吧！

    前言 我师父(http://www.cnblogs.com/aaronjs/)说应当阅读框架(jquery),所以老夫就准备开始看了 然后公司的师兄原来写了个dom选择器,感觉不错啊!!!原来自己从来 ...

  6. java简单日历

    一.使用java的calendar类写一个简单的日历 package com.calendar; import java.util.Calendar; import java.util.Date; i ...

  7. Java解析XML文档(简单实例)——dom解析xml

      一.前言 用Java解析XML文档,最常用的有两种方法:使用基于事件的XML简单API(Simple API for XML)称为SAX和基于树和节点的文档对象模型(Document Object ...

  8. jquery编写的简单日历

    以前在开发web页面的时候遇到日历,都是直接引入一些日历组件来用,一直不太明白实现原理,总感觉挺复杂的. 今天尝试着用jquery写了一个简单的日历功能,可以选择年份,月份,返回今天,原来简单的日历功 ...

  9. vue初学实践之路——vue简单日历组件(1)

    ---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...

随机推荐

  1. 多线程程序在单核cpu与多核cpu上是怎么工作的？

    转自 1.多线程在单核和多核CPU上的执行效率问题的讨论 a1: 多线程在单cpu中其实也是顺序执行的,不过系统可以帮你切换那个执行而已,其实并没有快(反而慢) 多个cpu的话就可以在两个cpu中同时 ...

  2. (线性结构dp )POJ 1260 Pearls

    Pearls Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 10558   Accepted: 5489 Descripti ...

  3. mybatis多数据源报错

    2018-12-06 16:58:35,709 [ main ] - [ INFO ] [ org.springframework.core.KotlinDetector : 57 ] - Kotli ...

  4. 关于SSM的小感悟

    这周用SSM框架写了个小项目,真是各种百度啊,最后总算是实现了个登陆功能.刚才一直在修改,想实现登陆进去可以对id进行搜索,出现搜索的整体数据,无奈,一直没能实现.所以就只能留到下周了,到时候会把这个 ...

  5. Numpy 笔记: 多维数组的切片(slicing)和索引(indexing)【转】

    目录 切片(slicing)操作 索引(indexing) 操作 最简单的情况 获取多个元素 切片和索引的同异 切片(slicing)操作 Numpy 中多维数组的切片操作与 Python 中 lis ...

  6. springMVC中a标签传递多个参数到后台的应用

    1.js页面:返回json填充HTML部分代码 <a class='byCard' href="+path+"/static/toCardView/"+ data. ...

  7. [C#]一个简易的、轻量级的方法并行执行线程辅助类

      一个简易的.轻量级的方法并行执行线程辅助类 在实际应用中,经常要让多个方法并行执行以节约运行时间,线程就是必不可少的了,而多线程的管理经常又是一件头疼的事情,比如方法并行执行异步的返回问题,方法并 ...

  8. 修改ScriptBundle 生成顺序

    ScriptBundle 一般用法 C#的代码如下: bundles.Add(new ScriptBundle("~/bundles/jqueryval") .Include(&q ...

  9. Hadoop — HDFS的概念、原理及基本操作

    1. HDFS的基本概念和特性 设计思想——分而治之:将大文件.大批量文件分布式存放在大量服务器上,以便于采取分而治之的方式对海量数据进行运算分析.在大数据系统中作用:为各类分布式运算框架(如:map ...

  10. 绕不开的hadoop

    安装 jdk 1.8 # 官网下载可能比较慢,请自行搜索国内镜像源 wget http://download.oracle.com/otn-pub/java/jdk/8u191-b12/2787e4a ...