JavaScript制作简单的日历效果


Posted in Javascript onMarch 10, 2016

本文实例为大家分享了

<!DOCTYPE html>
<html>
  <head>
    <meta charset="gb2312">
    <title></title>
  </head>
  <body>
    <script>
       
      document.write("<table>");
      document.write("<th colspan='7'>2016年3月</th>");
      document.write("<tr id='titleCss'>");
      document.write("<td>日</td>");
      document.write("<td>一</td>");
      document.write("<td>二</td>");
      document.write("<td>三</td>");
      document.write("<td>四</td>");
      document.write("<td>五</td>");
      document.write("<td>六</td>");
      document.write("</tr>");
      var num=1;
//     for(var i=0;i<5;i++){
//       document.write("<tr>");
//       
//       for(var j=0;j<7;j++){
//         if(i==0 && j<2) document.write("<td></td>");
//         else if(i==4 && j>=5) document.write("<td></td>");
//         else document.write("<td>" + num++ +"</td>");  
//       }
//       document.write("</tr>");
//     }
      document.write("<tr>");
      document.write("<td></td>");
      document.write("<td></td>");
      for(var i=3;i<=33;i++){
        document.write("<td>" + num++);
        if((i%7)==0) document.write("</td></tr><tr>");
        else document.write("</td>");
      }
      document.write("<td></td>");
      document.write("<td></td>");
      document.write("</tr>");
      document.write("</table>");
    </script>
  </body>
</html>

效果图:

JavaScript制作简单的日历效果

希望本文所述对大家学习javascript程序设计有所帮助。

Javascript 相关文章推荐
Javascript学习笔记二 之 变量
Dec 15 Javascript
javascript hashtable 修正版 下载
Dec 30 Javascript
非html5实现js版弹球游戏示例代码
Sep 22 Javascript
jQuery及JS实现循环中暂停的方法
Feb 02 Javascript
js实现登陆遮罩效果的方法
Jul 28 Javascript
js正则表达式replace替换变量方法
May 21 Javascript
jQuery实现base64前台加密解密功能详解
Aug 29 jQuery
JS实现的简单表单验证功能完整实例
Oct 14 Javascript
详解小程序退出页面时清除定时器
Apr 28 Javascript
ios中视频的最后一桢问题解决
May 14 Javascript
基于JavaScript实现单例模式
Oct 30 Javascript
javascript设计模式 ? 职责链模式原理与用法实例分析
Apr 16 Javascript
js滑动提示效果代码分享
Mar 10 #Javascript
js实现页面跳转的五种方法推荐
Mar 10 #Javascript
js实现页面跳转的五种方法推荐
Mar 10 #Javascript
js实现上一页下一页的效果【附代码】
Mar 10 #Javascript
WordPress 单页面上一页下一页的实现方法【附代码】
Mar 10 #Javascript
JavaScript资源预加载组件和滑屏组件的使用推荐
Mar 10 #Javascript
node.js实现爬虫教程
Aug 25 #Javascript
You might like
PHP 出现乱码和Sessions验证问题的解决方法!
2008/12/06 PHP
PHP 服务器配置(使用Apache及IIS两种方法)
2009/06/01 PHP
Laravel 5.4前后台分离,通过不同的二级域名访问方法
2019/10/13 PHP
PHP7修改的函数
2021/03/09 PHP
区分JS中的undefined,null,&quot;&quot;,0和false
2007/03/08 Javascript
JavaScript为对象原型prototype添加属性的两种方式
2010/08/01 Javascript
JavaScript高级程序设计 阅读笔记(四) ECMAScript中的类型转换
2012/02/27 Javascript
jquery 按钮状态效果 正常、移上、按下
2013/08/12 Javascript
Javascript基础知识(一)核心基础语法与事件模型
2014/09/29 Javascript
深入理解JavaScript系列(22):S.O.L.I.D五大原则之依赖倒置原则DIP详解
2015/03/05 Javascript
javascript实现在下拉列表中显示多级树形菜单的方法
2015/08/12 Javascript
jQuery的层级查找方式分析
2016/06/16 Javascript
如何用JS判断两个数字的大小
2016/07/21 Javascript
原生JS下拉加载插件分享
2016/12/26 Javascript
5种JavaScript脚本加载的方式
2017/01/16 Javascript
Angular实现双向折叠列表组件的示例代码
2017/11/21 Javascript
vue小白入门教程
2018/04/02 Javascript
JS中DOM元素的attribute与property属性示例详解
2018/09/04 Javascript
Koa 使用小技巧(小结)
2018/10/22 Javascript
Vue打包后访问静态资源路径问题
2019/11/08 Javascript
JavaScript实现像雪花一样的Hexaflake分形
2020/07/07 Javascript
jQuery实现简单全选框
2020/09/13 jQuery
[41:08]2014 DOTA2国际邀请赛中国区预选赛 HGT VS NE
2014/05/22 DOTA
使用grappelli为django admin后台添加模板
2014/11/18 Python
利用Psyco提升Python运行速度
2014/12/24 Python
JPype实现在python中调用JAVA的实例
2017/07/19 Python
numpy.delete删除一列或多列的方法
2018/04/03 Python
在双python下设置python3为默认的方法
2018/10/31 Python
python xpath获取页面注释的方法
2019/01/14 Python
python 寻找离散序列极值点的方法
2019/07/10 Python
个人租房协议书
2014/04/09 职场文书
2014年向国旗敬礼活动总结
2014/09/27 职场文书
财务年终工作总结大全
2019/06/20 职场文书
实例讲解Python中sys.argv[]的用法
2021/06/03 Python
Win11如何启用启动修复 ? Win11执行启动修复的三种方法
2022/04/08 数码科技
如何解决flex文本溢出问题小结
2022/07/15 HTML / CSS