<html>
<head>
<title>test89</title>
<table id="table" border=5 name="table">
<tr>
<th class="header" colspan=7></th>
</tr>
<tr class="big">
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
</table>
</head>
<body onload="displayCalendar()">
<script>
function displayCalendar(){
var today = new Date();
var dateOther = new Date();
var dateMont = new Date(today.getFullYear(),today.getMonth(),1);
var month = dateMont.getMonth();
var day = dateMont.getDay();
var year = dateMont.getFullYear();
//имена месяцев и дни недель
var monthNames = ["Январь","Февраль","Март","Апрель","Май","Июнь","Июль","Авгус т","Сентябрь","Октябрь","Ноябрь", "Декабрь"];
var dayNames = ["Пн","Вт","Ср","Чт","Пт","Сб", "Вс"];
//построение таблицы
var tbl=document.getElementsByClassName("header")[0].innerHTML=monthNames[month]+" "+year;
var tbl=document.getElementById('table');
for (i=0; i<7; i++) {
tbl.rows[1].cells[i].innerHTML=dayNames[i];
}
for ( i=0; i<6; i++){
if(i == 5 && dateMont.getMonth() != month) {
table.deleteRow(tbl.rows[i+2]);
i++;
} else {
for (j=0; j<7; j++) {
var k = j<6? j + 1 : 0;
var n = dateMont.getDay() == 0? 7: dateMont.getDay();
if(dateMont.getDay() == k && dateMont.getMonth() == month) {
tbl.rows[i+2].cells[j].innerHTML = dateMont.getDate();
if(today.getDate() == dateMont.getDate()) tbl.rows[i+2].cells[j].style.backgroundColor = 'lightgreen';
dateMont.setDate(dateMont.getDate() + 1);
} else {
if(i == 0) {
dateOther = new Date();
dateOther.setDate(dateMont.getDate() - (n - k));
tbl.rows[i+2].cells[j].innerHTML = dateOther.getDate();
tbl.rows[i+2].cells[j].style.color = 'gray';
} else {
dateOther = new Date();
dateOther.setDate(dateMont.getDate());
tbl.rows[i+2].cells[j].innerHTML = dateOther.getDate();
tbl.rows[i+2].cells[j].style.color = 'gray';
dateMont.setDate(dateMont.getDate() + 1);
}
}
}
}
}
}
</script>
<div id="calendar"></div>
<style>
.dayNow{
border: 2px solid black;
color:Red;
text-align: center;
}
</style>
</body>
</html>