45fan.com - 路饭网

搜索: 您的位置主页 > 电脑频道 > 编程代码 > 阅读资讯:怎么样通过javascript html实现网页版日历代码?

怎么样通过javascript html实现网页版日历代码?

2016-03-22 16:31:48 来源:www.45fan.com 【

怎么样通过javascript html实现网页版日历代码?

本文实例为大家分享了网页版日历代码,供大家参考,具体内容如下

效果图:

怎么样通过javascript html实现网页版日历代码?

实现代码:

<html>
 <head>
 <link rel="stylesheet" type="text/css" href="Skin.css">
 <style>
 <!--
 table{ text-align: center }
 -->
 </style>
 </head>
 
 <body>
 <div align="center">
  <script language="javascript">
  var my = new Date();
  
  function showc() {
  var k=1;
  var j=1;
  var today;
  var tomonth;
  var theday=1;//日期
  var max;
  var temp;
  var tempday;//这个月第一天的星期
  document.write ("<b>" + my.getFullYear() + "-" + (my.getMonth()+1) + "</b>");
  document.write ("<table border='1' width='273' height='158'>");
  document.write ("<tr>");
  document.write ("<td height='23' width='39'><font color='red'>Sun</font></td>");
  document.write ("<td height='23' width='39'>Mon</td>");
  document.write ("<td height='23' width='39'>Tue</td>");
  document.write ("<td height='23' width='39'>Wed</td>");
  document.write ("<td height='23' width='39'>Thu</td>");
  document.write ("<td height='23' width='39'>Fri</td>");
  document.write ("<td height='23' width='39'>Sat</td>");
  document.write ("</tr>");
  temp=my.getDate();
  my.setDate(1);
  //document.write (my.getDate());
  tempday=my.getDay();//返回第一天是星期几
  my.setDate(temp);
  today=my.getDay();//返回现在星期几
  
  switch ((my.getMonth()+1)) {
  case 1:
  case 3:
  case 5:
  case 7:
  case 8:
  case 10:
  case 12:
  max=31;
  break;
  case 4:
  case 6:
  case 9:
  case 11:
  max=30;
  break;
  default:
  max=29;//这里没有考虑闰月!!
  //document.write (max);
  }
  for(k=0;k<6;k++) {
  document.write ("<tr>");
  for(j=0;j<=6;j++) {
  document.write ("<td height='23' width='39'>");
  if(j>=(tempday)) {
  tempday=0;//设置为最小,相当于取消判断条件
  if(theday<=max) {
   document.write ("<a title=" + my.getFullYear() + "-" + (my.getMonth()+1) + "-" +theday + " target='_blank' href=detail.asp?date=" + theday + ">");
   if(theday==my.getDate())
   document.write ("<font color='green'>[" + theday + "]</font></a>");
   else if(j==0)
   document.write ("<font color='red'>" + theday + "</font></a>");
   else
   document.write (theday + "</a>");
   theday++;
  }
  }
  document.write ("</td>");
  }
  document.write ("</tr>");
  }
  document.write ("</table>");
  }
  
  showc();
 </script>
 </div>
 <body>
</html>

以上就是本文的全部内容,希望大家可以轻松实现网页版日历。


本文地址:http://www.45fan.com/bcdm/43232.html
Tags: 实现 JavaScript html
编辑:路饭网
推广内容
推荐阅读
热门推荐
推荐文章
关于我们 | 联系我们 | 友情链接 | 网站地图 | Sitemap | App | 返回顶部