js生成日历(php编写一个月的日历)

<!DOCTYPEhtml><html> <head> <metacharset=”utf-8″> <title></title> <styletype=”text/css”> .main{ width:800px; margin:0auto; } …

大家好,又见面了,我是你们的朋友全栈君。

在这里插入图片描述

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
.main { 

width: 800px;
margin: 0 auto;
}
.top { 

width: 800px;
margin: 0 auto;
}
#nian { 

width: 100px;
height: 30px;
display: block;
}
#yue { 

width: 100px;
height: 30px;
display: block;
}
.float { 

display: block;
width: 50px;
}
.center { 

margin: 0 auto;
width: 800px;
}
#tab tr { 

height: 150px;
}
#tab tr td,
th { 

width: 150px;
}
</style>
</head>
<body>
<div class="main">
<div class="top">
<select id="nian" class="float" onchange="huan()">
</select>
<span class="float"></span>
<select id="yue" class="float" onchange="huan()">
</select>
<span class="float"></span>
</div>
</div>
<div class="center">
<table id="tab" border="" cellspacing="" cellpadding="">
<tr>
<th>周日</th>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
<th>周五</th>
<th>周六</th>
</tr>
</table>
</div>
<script type="text/javascript">
var tab = document.getElementById("tab");
window.onload = function() { 

var nian = document.getElementById("nian");
var yue = document.getElementById("yue");
for (var i = 2019; i >= 1970; i--) { 

var sel = document.createElement("option");
sel.value = i;
sel.innerText = i;
nian.appendChild(sel);
}
for (var i = 1; i <= 12; i++) { 

var sel = document.createElement("option");
sel.value = i;
sel.innerText = i;
yue.appendChild(sel);
}
huan();
}
function huan() { 

var week = 0;//周几
var day = 1;//从第一天开始
var days = 30;//这个月一共有几天
// try{ 

// var ziji=document.getElementsByTagName("td")[0];
// ziji.parentElement.parentElement.removeChild(ziji.parentElement);
// }catch(e){ 

// //TODO handle the exception
// }
try{ 

//添加一个add1的类,方便删除
var dataa=document.getElementsByClassName("add1");
for(var i=0;i<dataa.length;){ 

dataa[0].remove();
}
}catch(e){ 

//TODO handle the exception
}
var nian = document.getElementById("nian").value;
var yue = document.getElementById("yue").value;
var date = new Date(nian + "-" + yue + "-1");
//计算这个月有多少天
var data = new Date(nian,yue,0);
days=data.getDate();
// alert(days)
var newtr = document.createElement("tr");
newtr.classList.add("add1");
for (var i = 0; i < date.getDay(); i++) { 

if (week == 7) { 

week = 0;
}
var newtd = document.createElement("td");
newtr.appendChild(newtd);
week++;
}
if (week <= 6) { 

for (; week <= 6; week++, day++) { 

var newtd = document.createElement("td");
newtd.innerText = day;
newtd.value = day;
newtr.appendChild(newtd);
}
}
tab.appendChild(newtr);
week = 0;
newtr = document.createElement("tr");
newtr.classList.add("add1");
for (; day <= days; day++, week++) { 

if (week == 7) { 

week = 0;
tab.appendChild(newtr);
newtr = document.createElement("tr");
newtr.classList.add("add1");
}
var newtd = document.createElement("td");
newtd.innerText = day;
newtd.value = day;
newtr.appendChild(newtd);
}
tab.appendChild(newtr);
}
</script>
</body>
</html>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/125975.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • 二十三又是谁的二十三

    二十三又是谁的二十三23岁那年你正处在哪个状态?现在呢?我,23岁,应届毕业生。生活,工作,爱情都处于人生的低谷,一穷二白,一无所有,一事无成。分享一下成长的建议吧。匿名用户23岁那年…就是去年…在22岁的时候我毕业,同时第二年准备考研,结果因为压力太大,期望太高,又失利了,但是我依然满怀信心和憧憬在我23岁那年四月,当我深爱的女孩(在这之前我追了她四年)说她要去北京时,我在毫无准备的情况下,带了2000块钱冲到北京,那会的北京还有点冷…但是我只是想打好前站,在她来的时候能提供一点帮助,在前两周里,每天面试两家公

  • JavaScript 数组排序【六大方法】「建议收藏」

    JavaScript 数组排序【六大方法】「建议收藏」文章目录数组排序sort()方法冒泡排序选择排序插入排序快速排序希尔排序数组排序排序,就是把一个乱序的数组,通过我们的处理,让他变成一个有序的数组1.sort()方法sort()数组对象排序其原理是冒泡排序reverse()方法能够颠倒数组元素的排列顺序例如:vararr=[3,1,5,6,4,9,7,2,8];varasc=arr.sort()console.log(asc); //1,2,3,4,5,6,7,8,9vardesc=asc.

  • 网站优化怎样的外链能轻松收录,网站外链优化攻略「建议收藏」

    网站优化怎样的外链能轻松收录,网站外链优化攻略「建议收藏」有些事情,让你感到很无奈,网站外链优化也是如此,往往那些很容易发布网站外链的地方,价值不大,而不容易发布外链的地方,一旦发布上去了,效果胜过几十条甚至更多的外链,而且可以轻松让搜索引擎收录,网站优化怎样让网站外链轻松被收录呢?<ignore_js_op>一、善于寻找我们运营的是网站,发布外链的地方也是网站,除了内容有差异之外,权重高低也有差别,我们要找的自然是高于我们权重的网站,…

  • 硬盘的存储原理_移动硬盘工作原理

    硬盘的存储原理_移动硬盘工作原理主要记录磁盘的分类、组成等。

  • SQL EXITS用法

    SQL EXITS用法比如在Northwind数据库中有一个查询为SELECTc.CustomerId,CompanyNameFROMCustomerscWHEREEXISTS(SELECTOrderIDFROMOrdersoWHEREo.CustomerID=c.CustomerID) 这里面的EXISTS是如何运作呢?子查询返回的是OrderId字段,可是外面的查询要找的是Cu

    2022年10月30日
  • 1045 Access denied for user ‘root’@’localhost’ (using password: YES)[通俗易懂]

    1045 Access denied for user ‘root’@’localhost’ (using password: YES)[通俗易懂]MySQL连接错误,使用Navicat连接MySQL出现错误:1045Accessdeniedforuser’root’@’localhost'(usingpassword:YES)解决方法:编辑mysql配置文件my.ini(在mysql的安装目录下,不同电脑可能不一样,参考目录①D:\ProgramFiles\MySQL\MySQLServer5.0\my….

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号