其实我是一个对时间和日期不怎么感兴趣的人，小学的时候感觉时间或者日期那块就让我很晕，因为有时候是100进制有时候是60进制，搞的我对日历一直很不感兴趣，最近不知道为什么想写一个日历了，可想而知，这个玩意对我的大脑会造成多大的伤害，很简单的.

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>日历</title>

<style type="text/css">

*{ margin:0; padding:0; list-style:none;}

</style>

</head>

<body>

<div id="can" style="border-bottom:1px solid #ccc; border-right:1px solid #ccc; width:357px; overflow:hidden; float:left; margin:100px;">

</div>

</body>

</html>

<script type="text/javascript">

    var obj=document.getElementById("can");

    var oDl=document.createElement("dl");

    var arrWeek=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]

    for(var i=0;i<7;i++){

        var oDt=document.createElement("dt");

        oDt.style.background="#f2f2f2";

        oDt.style.width=50+"px";

        oDt.style.height=30+"px";

        oDt.style.textAlign="center";

        oDt.style.lineHeight=30+"px";

        oDt.style.fontSize=13+"px";

        oDt.style.borderWidth=1+"px";

        oDt.style.borderColor="#ccc";

        oDt.style.borderStyle="solid";

        oDt.style.borderRight="none";

        oDt.style.borderBottom="none";

        oDt.style.cssFloat="left";

        oDt.innerHTML=arrWeek[i];

        oDl.appendChild(oDt);

    }

    for(var i=0;i<42;i++){

        var oDt=document.createElement("dd");

        oDt.style.width=50+"px";

        oDt.style.height=30+"px";

        oDt.style.textAlign="center";

        oDt.style.lineHeight=30+"px";

        oDt.style.fontSize=13+"px";

        oDt.style.borderWidth=1+"px";

        oDt.style.borderColor="#ccc";

        oDt.style.borderStyle="solid";

        oDt.style.borderRight="none";

        oDt.style.borderBottom="none";

        oDt.style.cssFloat="left";

        oDl.appendChild(oDt);

    }

    obj.appendChild(oDl);

    var aDd=obj.getElementsByTagName("dd");

    var d=new Date();

    var y=d.getFullYear();

    var m=d.getMonth();

    var da=d.getDate();

    var d2=new Date(y,m,0);

    var d3=new Date(y,m+1,0);

    var md=d3.getDate();

    var d2w=d2.getDay();

    for(var i=0;i<md+d2w+1;i++){

        if(i<d2w || i==d2w){

            aDd[i].innerHTML="";

        }else{

            if(i-d2w==da){

                aDd[i].style.backgroundColor="#aaa"

                }

            aDd[i].innerHTML=i-d2w;

        }

    }

</script>

当然，这个只是一个简单到简陋，简陋到我估计都不能使用了，哈哈，爱好而已

js写个日历的更多相关文章

  1. 自己用js写的日历（在考勤中使用，显示员工的日期的考勤情况）

    1.HTML部分 <div id="AttendanceDataDetailDiv"> <div class="A_close"> &l ...

  2. javascript js写特效日历

    <!doctype html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 纯JS写出日历

    封装代码: (function(cmf){ cmf.showDcalendar=function(){ var fnname=cmf.fn var id="cmfrili2" va ...

  4. JS写一个简单日历

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

  5. 【原】js 签到用日历

    最近做的一个项目中,需要用到一个日历来记录你的签到,网上找了一些,感觉挺庞大的,所以就自己写了一个,记录一下自己写这个日历的经过 html代码: <table cellspacing=" ...

  6. js超简单日历

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

  7. 原生js日历选择器，学习js面向对象开发日历插件

    在web开发过程中经常会碰到需要选择日期的功能,一般的操作都是在文本框点击,然后弹出日历选择框,直接选择日期就可以在文本框显示选择的日期.开发好之后给用户使用是很方便,但如果每一个日历选择器都要临时开 ...

  8. Node.js写文件的三种方法

    Node.js写文件的三种方式: 1.通过管道流写文件 采用管道传输二进制流,可以实现自动管理流,可写流不必当心可读流流的过快而崩溃,适合大小文件传输(推荐) var readStream = fs. ...

  9. 用JS写了一个打字游戏，反正我是通不了关

    今天想写个简单的游戏, 打字游戏好像都没写过, 那么就写打字游戏吧, gamePad包含了关卡的信息, 可以用来调整给个关卡字符下落的速度: getRandom函数会返回一个字符对象, 这个对象包含了 ...

随机推荐

  1. TP主从服务器配置

    在config.php文件中,设置‘DB_DEPLOY_TYPE’=>1,‘DB_HOST’=>‘localhost,192.168.0.1,192.168.0.23’,各个主机之间用逗号 ...

  2. 给图像添加logo

    #include <opencv2\opencv.hpp>#include"ProcessPixels.h"using namespace cv;using names ...

  3. 缓存方案之Redis

    Redis简介   Redis是Remote Dictionary Server(Redis) 的缩写,或许光听名字你就能猜出它大概是做什么的.不错,它是一个由Salvatore Sanfilippo ...

  4. Mongodb 笔记09 备份、部署MongoDB

    备份 1. 只有在有信心能在紧急情况下完成迅速部署的情况下,备份才是有用的.所以,无论选择了哪种备份技术,一定要对备份及恢复备份的操作进行练习,知道了然于心. 2. 通常情况下,应对副本集的非主节点( ...

  5. MAC常用快捷键

    1.F11 用于当前界面与桌面进行切换,Command-M 最小化窗口,Option-Command-M 最小化所有窗口,Command-数字 切换数字指定的网页列表 Shift-Command-D ...

  6. TreeNode动态邦定事件

    1. 显示不能用TextField,应该用StaticText 2. public void SetNodesAction(Tree t, String methodbind){ ArrayList ...

  7. After install XAMPP

    1. configure mysql and phpmyadmin 1.1 mysql $ /Applications/XAMPP/xamppfiles/bin/mysql -uroot $ mysq ...

  8. Oracle 行迁移和行链接

    一.行迁移 1.1.行迁移概念 当一个行上的更新操作(原来的数据存在且没有减少)导致当前的数据不能在容纳在当前块,我们需要进行行迁移.一个行迁移意味着整行数据将会移动,仅仅保留的是一个转移地址.因此整 ...

  9. Codeforces 735C：Tennis Championship（数学+贪心）

    http://codeforces.com/problemset/problem/735/C 题意:有n个人打锦标赛,淘汰赛制度,即一个人和另一个人打,输的一方出局.问这n个人里面冠军最多能赢多少场, ...

  10. 用C#.NET编写软件注册机

    验证注册码是保护软件产品产权的常用手段.一般过程如下, 1.  软件发行者收集用户特有的信息: 2.  根据用户特有的信息,使用注册机生成注册码并把注册码发给客户: 3.  向软件导入注册码,由软件自 ...