基础java写日历

科技前沿 • 2024-12-28 15:59 • 阅读 44

大家好，我是讯享网，很高兴认识大家。

创建一个简单的日历日程需要用到HTML来构建日历的布局，CSS来设置样式，以及JavaScript来处理日程逻辑。以下是一个基础的例子，你可以根据自己的需求进行修改和扩展。

 
 <!DOCTYPE html> 
 <html lang="zh-CN"> 
 <head> 
 <meta charset="UTF-8"> 
 <title>简单日历日程</title> 
 <style>body {font-family: 'Arial', sans-serif;}.calendar {width:300px;margin: auto;}.calendar table {width:100%;border-collapse: collapse;}.calendar table, th, td {border:1px solid #ddd;}.calendar th, .calendar td {padding:10px; text-align: center;}.calendar th {background-color: #f2f2f2;}.today {background-color: #ffff99;} 
 </style> 
 </head> 
 <body> 
 
 <div class="calendar"><div id="date"></div><table><thead><tr><th>日</th><th>一</th><th>二</th><th>三</th><th>四</th><th>五</th><th>六</th></tr></thead><tbody 基础java写日历 id="calendarBody"> 日历内容将在这里动态生成 --></tbody></table> 
 </div> 
 
 <script> 
 //获取当前日期对象 
 let now = new Date(); 
 //获取当前年月日 
 let year = now.getFullYear();  
 let month = now.getMonth() +1; // JavaScript中，月份是从0开始的 
 let day = now.getDate(); 
 
 //生成日历头部，如“2023年1月” 
 document.getElementById('date').innerText = `${year}年${month}月`; 
 
 //计算第一天是周几（0-6对应周日-周六） 
 let firstDay = new Date(year, month -1,1).getDay(); 
 //计算月天数 
 let lastDay = new Date(year, month,0).getDate(); 
 
 //动态生成日历 
 let calendarBody = document.getElementById('calendarBody'); 
 for (let i =0; i <= (lastDay + firstDay -1); i++) {let dayCell = document.createElement('td');//判断是否为当天if (i >= firstDay && i <= lastDay) {dayCell.innerText = i - firstDay +1;//标记当天if (i - firstDay +1 === day) {dayCell.classList.add('today');}} else {dayCell.innerText = '';}calendarBody.appendChild(dayCell); 
 } 
 </script> 
 
 </body> 
 </html>

这段代码创建了一个基础的日历，它会显示当前月份的日历，并高亮显示当天日期。你可以根据需要添加更多的功能，例如点击日期显示具体日程、保存和加载日程数据等。

基础java写日历

相关推荐