HTML网页之日历代码
效果顯示一：點擊這里！? ? ? 這些代碼網(wǎng)上是有的，我只是在這里幫忙分享一下，希望能給你帶來幫助。
下面這個圖的代碼相對長一點這里就不上傳上來了，需要的點擊這里下：點擊這里！
<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();//返回現(xiàn)在星期幾
? ? ? ? ? ?
? ? ? ? ? ? ?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;//設(shè)置為最小，相當(dāng)于取消判斷條件
? ? ? ? ? ? ? ? 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>
總結(jié)
以上是生活随笔為你收集整理的HTML网页之日历代码的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Electron实现桌面日历
- 下一篇： 技术胖--前端学习html5表单美化部分