jQuery google日历练习-20130731

最新推荐文章于 2013-09-22 23:58:22 发布

xjwolaile

最新推荐文章于 2013-09-22 23:58:22 发布

阅读量80

点赞数

分类专栏：前端技术 jQuery 学习文章标签： getDate getMonth getFullYear getDay

本文链接：https://blog.csdn.net/xjwolaile/article/details/84464660

版权

学习同时被 3 个专栏收录

219 篇文章 0 订阅

订阅专栏

前端技术

188 篇文章 0 订阅

订阅专栏

jQuery

63 篇文章 0 订阅

订阅专栏

一、效果及功能说明

模仿google日历自己来完成一个日历的所有效果

二、我的想法

1、首先是要获得年月日和星期几然后在到需要显示的地方显示出来

2、通过每个方法来获得年月日和星期几但是星期几是需要-1才能获得正常星期几

三、效果图

[img]http://dl2.iteye.com/upload/attachment/0087/7037/645f6940-ac7f-3239-ad11-4c066d0b2f54.jpg[/img]

四、代码


<!DOCTYPE html>

<head>
	<meta charset="UTF-8">
	<link rel="stylesheet" type="text/css" href="css/backmanage_login.css" />
	<script language="javascript" type="text/javascript" src="http://www.jsfoot.com/skin/js/jquery.js"></script>
	<script language="javascript" type="text/javascript">
	$(document).ready(function(){
	//定义方法
		setInterval(showTime, 100);
		//定义出现时间
		function timer(obj,txt){
		//定义直接可以写入的方法
         	obj.text(txt);
         	//进入html里
    	}
    	function showTime(){  
    	//定义获得年月日和星期的方法      
		var today = new Date();
		//定义参数 新建一个获得年月份的方法
        var weekday=new Array(7)
        //定义参数 新建一个数组
        weekday[0]="星期一"
        weekday[1]="星期二"
        weekday[2]="星期三"
        weekday[3]="星期四"
        weekday[4]="星期五"
        weekday[5]="星期六"
        weekday[6]="星期日"
        //里面放有星期1到星期日
        var month=new Array(12)
        //定义参数 新建一个数组
		month[0]="1"
		month[1]="2"
		month[2]="3"
		month[3]="4"
		month[4]="5"
		month[5]="6"
		month[6]="7"
		month[7]="8"
		month[8]="9"
		month[9]="10"
		month[10]="11"
		month[11]="12"    
		//里面有代表12个月份                                  
        var y=today.getFullYear()+"年";
        //定义参数 获得当前的年份
        var month=month[today.getMonth()] +"月";
        //定义参数 获得当前的月份
        var td=today.getDate()+"日";
        //定义参数 获得当前的多少号
        var d=weekday[today.getDay() -1];
        //定义参数 获得当前星期几
	    timer($("#aa"),y);
	    timer($("#ss"),month);
	    timer($("#dd"),td);
	    timer($("#ff"),d);
	    //让他们写入不同的p标签里面
    	}
	});
	</script>
</head>

<body>
<div class="date">
	<p id="aa"></p>
	<p id="ss"></p>
	<p id="dd"></p>
	<p id="ff"></p>
</div>
</body>
</html>

(每天跟进更新把今天的写的东西和想法更新到上面)

xjwolaile

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery google日历练习-20130731

一、效果及功能说明模仿google日历自己来完成一个日历的所有效果二、我的想法 1、首先是要获得年月日和星期几然后在到需要显示的地方显示出来2、通过每个方法来获得年月日和星期几但是星期几是需要-1才能获得正常星期几三、效果图[img]http://dl2.iteye.com/upload/attachment/0087/7037/64...
复制链接

扫一扫

专栏目录