zoukankan      html  css  js  c++  java
  • js写个日历

    其实我是一个对时间和日期不怎么感兴趣的人,小学的时候感觉时间或者日期那块就让我很晕,因为有时候是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; 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>

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

  • 相关阅读:
    android 之短信发送
    android 系统之ContentProvider
    android 开发电话拔号
    android 开发笔记
    android 常用权限备份
    在IE中使用Firebug
    常用的公式语言
    ASP.NET程序访问MS SQL的方法
    [News]将有新的代码生成工具集成在designer 8.5.1中
    JS对Lotus域的操作
  • 原文地址:https://www.cnblogs.com/busicu/p/3731503.html
Copyright © 2011-2022 走看看