JavaScript制作简单的日历效果
作者:bea
本文实例为大家分享了 <!DOCTYPE html><html> <head> <meta charset="gb2312"> <title></title> </head> <body> <script> document.write("<table>"); document.write("&l
本文实例为大家分享了
<!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程序设计有所帮助。
有用 | 无用
<!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中循环遍历Array与Map的方法小结
- Node.js的Express框架使用上手指南
- Node.js项目中调用JavaScript的EJS模板库的方法
- JavaScript操作HTML DOM节点的基础教程
- 举例说明JavaScript中的实例对象与原型对象
- JavaScript中setTimeout和setInterval函数的传参及调用
- 原生JavaScript制作微博发布面板效果
- JavaScript获取图片像素颜色并转换为box-shadow显示
- 详解Angularjs中的依赖注入
- 详解AngularJS过滤器的使用
- javascript html5 canvas实现可拖动省份的中国地图
- js仿百度登录页实现拖动窗口效果
- 基于jQuery日历插件制作日历
- jQuery Html控件基本操作(日常收集整理)
- JavaScript获取客户端IP的方法(新方法)
- JavaScript高级程序设计(第三版)学习笔记6、7章
- JavaScript高级程序设计(第三版)学习笔记1~5章
- Angularjs中使用Filters详解
- 使用jquery.qrcode.min.js实现中文转化二维码