Comment detail

年間カレンダー (Nested Flatten)

404 Blog Not Found:javascript - カレンダーを作るに実際に動くデモがありますので併せてご覧下さい。なるべく再利用しやすいよう書きました。

Dan the JavaScripter

 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
83
84
85
86
87
88
89
90
91
92
93
function leap(year){
  return year % 4 ? 0 : year % 100 ? 1 : year % 400 ? 0 : 1;
}

function make_cal_array(year){
  var months = [31, 28 + leap(year), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
  var result = [];
  for (var m = 0; m < 12; m++){
    result[m] = [];
    var dofw1 = (new Date(year, m, 1, 0, 0, 0)).getDay();
    for (var d = 1; d <= months[m]; d++){
      result[m][d + dofw1 - 1] = d;
    }
  }
  return result;
}

var daynames = ['sun','mon','tue','wed','thr','fri','sat'];

function make_cal_yearly(year){
  var cal = make_cal_array(year);
  var tbody = document.createElement('tbody');
  for (var m = 0; m < 12; m++){
    var tr = document.createElement('tr');
    var th = document.createElement('th');
    th.innerHTML = m + 1;
    tr.appendChild(th);
    for (var d = 0, l = cal[m].length; d < l; d++){
      var td = document.createElement('td');
      if (cal[m][d]){
        td.innerHTML = cal[m][d];
        td.className = daynames[d % 7];
      }
      tr.appendChild(td);
    }
    tbody.appendChild(tr);
  }
  var table = document.createElement('table');
  table.className = 'ycal';
  var caption = document.createElement('caption');
  caption.innerHTML = year;
  table.appendChild(caption);
  table.appendChild(tbody);
  return table;
}

function make_cal_monthly(year, m){
  var cal = make_cal_array(year);
  var table = document.createElement('table');
  // header
  var tr = document.createElement('tr');
  for (var d = 0; d < 7; d++){
    var th = document.createElement('th');
    th.innerHTML = th.className = daynames[d];
    tr.appendChild(th);
  }
  var thead = document.createElement('thead');
  thead.appendChild(tr);
  table.appendChild(thead);
  // body;
  var tbody = document.createElement('tbody');
  for (var d = 0, l = cal[m].length; d < l; d++){
    if (d % 7 == 0) tr = document.createElement('tr');
    var td = document.createElement('td');
    if (cal[m][d]){
      td.innerHTML = cal[m][d];
      td.className = daynames[d % 7];
    }
    tr.appendChild(td);
    if (d % 7 == 6) tbody.appendChild(tr);
  }
  tbody.appendChild(tr);
  table.className = 'mcal';
  var caption = document.createElement('caption');
  caption.innerHTML = year + '.' + (m+1);
  table.appendChild(caption);
  table.appendChild(tbody);
  return table;
}

function make_calendars(year, p){
  p.innerHTML = '';
  p.appendChild(make_cal_yearly(year));
  for (var m = 0; m < 12; m++){
   var mcal = make_cal_monthly(year, m);
   p.appendChild(mcal);
   if (m % 3 == 2){
     var br = document.createElement('br');
     br.clear = 'all';
     p.appendChild(br);
   }
  };
}

Index

Feed

Other

Link

Pathtraq

loading...