Código de JavaScript - Calendario

Imágen de perfil

Calendariográfica de visualizaciones


JavaScript

Publicado el 21 de Abril del 2016 por Gabi
694 visualizaciones desde el 21 de Abril del 2016. Una media de 21 por semana
Genera un calendario mediante JavaScript en el que puedes avanzar hacia el siguiente mes o el anterior.

Requerimientos

Navegador Web

1.0

Actualizado el 22 de Abril del 2016 (Creado el 21 de Abril del 2016)gráfica de visualizaciones de la versión: 1.0
695 visualizaciones desde el 21 de Abril del 2016. Una media de 21 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

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
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Ejemplo de Calendario</title>
</head>
 
<body onload="calendario()">
 
<details>
<H1>Calendario</H1>
<p id="demo"></p>
</details>
 
<script>
function calendario(anyo, mes) {
  document.getElementById("demo").innerHTML="";
 
  var body = document.getElementById ("demo");
  var d = new Date();
  var meses = new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");
  var dias = new Array("L","M","X","J","V","S","D");
 
  if (anyo == null) {
     anyo = d.getFullYear();
  } else {
     d.setFullYear(anyo);
  }
  var anyoant = anyo - 1;
  var anyosig = anyo + 1;
 
  if (mes == null) {
     mes = d.getMonth();
  } else {
     d.setMonth(mes);
  }
 
  if (mes == 0) {
     var mesant = 11;
  } else {
     var mesant = mes - 1;
  }
 
 
  if (mes == 11) {
     var messig = 0;
  } else {
     var messig = mes + 1;
  }
 
  var dia = 1;
 
  var table     = document.createElement("table");
 
  var tableRow  = document.createElement("tr");
 
  var tableData = document.createElement("td");
  tableData.setAttribute("colspan", "7");
  var textCell  = document.createTextNode(anyo);
  tableData.appendChild(textCell);
  tableRow.appendChild(tableData);
  table.appendChild(tableRow);
 
  var tableRow  = document.createElement("tr");
 
  var tableData = document.createElement("td");
  tableData.onclick = function(){if (mesant == 11) {calendario(anyoant, mesant);}else{calendario(anyo, mesant);}};
  var textCell  = document.createTextNode("<");
  tableData.appendChild(textCell);
  tableRow.appendChild(tableData);
 
  var tableData = document.createElement("td");
  tableData.setAttribute("colspan", "5");
  var textCell  = document.createTextNode(meses[mes]);
  tableData.appendChild(textCell);
  tableRow.appendChild(tableData);
 
  var tableData = document.createElement("td");
  tableData.onclick = function(){if (messig == 0) {calendario(anyosig, messig);}else{calendario(anyo, messig);}};
  var textCell  = document.createTextNode(">");
  tableData.appendChild(textCell);
  tableRow.appendChild(tableData);
 
  table.appendChild(tableRow);
 
  var tableRow  = document.createElement("tr");
  for (var i = 0; i < 7; i++) {
    var tableData = document.createElement("td");
    var textCell  = document.createTextNode(dias[i]);
    tableData.appendChild(textCell);
    tableRow.appendChild(tableData);
  }
 
  table.appendChild(tableRow);
  d.setDate(dia);
  while (mes == d.getMonth()) {
    var tableRow = document.createElement("tr");
 
    for (var i = 0; i < 7; i++) {
      var tableData = document.createElement("td");
      if (mes != d.getMonth()) {
        var textCell = document.createTextNode(" ");
      } else {
        if ((1 + i) < d.getDay()) {
          var textCell = document.createTextNode(" ");
        } else {
          var textCell = document.createTextNode(dia);
          dia++;
          d.setDate(dia);
        }
      }
 
      tableData.appendChild(textCell);
      tableRow.appendChild(tableData);
    }
 
    table.appendChild(tableRow);
  }
 
  table.setAttribute("border", "1");
 
  body.appendChild(table);
 
}
 
 
</script>
 
</body>
</html>



Comentarios sobre la versión: 1.0 (0)


No hay comentarios
 

Comentar la versión: 1.0

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios

http://lwp-l.com/s3513