JS/calendarJS at master · alTach/JS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<html>

<head>
  <meta charset="utf-8">
	<style>
	    table {
	      border-collapse: collapse;
	    }
	    td,
	    th {
	      border: 1px solid black;
	      padding: 3px;
	      text-align: center;
	    }
	    th {
	      font-weight: bold;
	      background-color: #E6E6E6;
	    }
	</style>
</head>

<body>
  <div id="calendar"></div>
</body>

  <script>
    /*
  i don't try make effective algorithm i want to lear method appendChild() and
  practical other capabilities

*/

//create calendar
function createCalendar(id, year, month) {

      var elem = document.getElementById(id)
      elem.innerHTML = "";

      var date = new Date(year, month-1);

      //effectiv algoritm when you save all node in varible afted add to page, but
      elem.appendChild(document.createElement('table'))
      elem = elem.firstChild

      for(var i=0, temp; i<6; i++){
        elem.appendChild(document.createElement('tr'))
        temp = elem.childNodes[i]
        for(var j=0; j<7; j++){
          if( i != 0 ) {
            temp.appendChild(document.createElement('td'))
            if ( (date.getDay() == 0 && j==6) || date.getDay() == j+1) {
                if(month-1 == date.getMonth()) {
                  temp.childNodes[j].innerHTML = date.getDate();
                  date.setDate( date.getDate() + 1 );
                }
            }
          // блок header
          } else {
            temp.appendChild(document.createElement('th'))
            temp.childNodes[0].innerHTML = "пн"
            temp.appendChild(document.createElement('th'))
            temp.childNodes[1].innerHTML = "вт"
            temp.appendChild(document.createElement('th'))
            temp.childNodes[2].innerHTML = "ср"
            temp.appendChild(document.createElement('th'))
            temp.childNodes[3].innerHTML = "чт"
            temp.appendChild(document.createElement('th'))
            temp.childNodes[4].innerHTML = "пт"
            temp.appendChild(document.createElement('th'))
            temp.childNodes[5].innerHTML = "сб"
            temp.appendChild(document.createElement('th'))
            temp.childNodes[6].innerHTML = "вс"
            break;
          }
        }
      }
}

createCalendar('calendar', 2012, 9)
  </script>
</body>
</html>