fallo al mostar json en columna de tabla html
Publicado por Fulgencio (7 intervenciones) el 25/03/2020 13:23:47
Hola, tengo el html que os muestro pero no consigo ver la un resultado de una columna de un json en una tabla html
tengo que mostrar en una columna que yo he pusto en comentarios como columna de iconos los valores de a variable general del json
Gracias
tengo que mostrar en una columna que yo he pusto en comentarios como columna de iconos los valores de a variable general del json
Gracias
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
131
132
133
134
135
<!DOCTYPE html>
<html>
<body>
<p id="miEspacio"></p>
<script>
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var myObj = JSON.parse(this.responseText);
//var texto_clima=document.createTextNode(myObj[k].general);
//Creo array de dias de la semana
var dias_semana=["Lunes","Martes","Miercoles","Jueves","Viernes","Sabado","Domingo"];
// Obtener la referencia del elemento body
var body = document.getElementsByTagName("body")[0];
// Crea un elemento <table> y un elemento <tbody>
var tabla = document.createElement("table");
var tblBody = document.createElement("tbody");
// Crea las celdas
for (var i = 0; i < 8; i++) {
// Crea las hileras de la tabla
var hilera = document.createElement("tr");
for (var j = 0; j < 26; j++) {
// Crea un elemento <td> y un nodo de texto, haz que el nodo de
// texto sea el contenido de <td>, ubica el elemento <td> al final
// de la hilera de la tabla
var celda = document.createElement("td");
celda.setAttribute("height","48px");
celda.setAttribute("width","125px");
//var textoCelda = document.createTextNode("celda en la hilera "+i+", columna "+j);
var textoCelda_dia=document.createTextNode("dia");
var textoCelda_dias=document.createTextNode(dias_semana[i-1]);
var textoCelda_Temp=document.createTextNode("Temp");
var textoCelda_Horas=document.createTextNode((j-2)+"h");
//var textoCelda_Clima=document.createTextNode(myObj[1].general);
//PRIMERA COLUMNA ---- "dia" y dias de la semana
if(j==0){
if(j==0 && i==0){
celda.appendChild(textoCelda_dia);
}else{
celda.appendChild(textoCelda_dias);
}
}
//FIN PRIMERA COLUMNA
//SEGUNDA COLUMNA ---- "Temp"
//if(j==1){
//if(j==1 && i==0){
//celda.appendChild(textoCelda_Temp);
//}
//}
//FIN SEGUNDA COLUMNA
//PRIMERA FILA ---- "1h" hasta "23h"
if(i==0 && j>1){
celda.appendChild(textoCelda_Horas);
}
//fIN PRIMERA FILA
//COLUMNA ICONOS.- LAS IMAGENES SE PONEN CON setAttribute BACKGROUND O SIMILAR
//var textoCelda_Clima=document.createTextNode(myObj[4].dia);
if(j==1){
if(j==1 && i==0){
celda.appendChild(textoCelda_Temp);
}
}
for(var k=0;k<7;k++){
var textoCelda_Clima=document.createTextNode(myObj[i].general);
celda.appendChild(textoCelda_Clima);
}
//FIN COLUMNA ICONOS
hilera.appendChild(celda);
}
// agrega la hilera al final de la tabla (al final del elemento tblbody)
tblBody.appendChild(hilera);
}
// posiciona el <tbody> debajo del elemento <table>
tabla.appendChild(tblBody);
// appends <table> into <body>
body.appendChild(tabla);
// modifica el atributo "border" de la tabla y lo fija a "2";
tabla.setAttribute("border", "2");
for (var miDia in myObj){
// Controlando que json realmente tenga esa propiedad
//if (myObj.hasOwnProperty(miDia)) {
// Mostrando en pantalla
//document.write(dias_semana[miDia]+"<br>");
//alert("El dia es " + miDia);
}
}
}
xmlhttp.open("GET", "https://my-json-server.typicode.com/raulserrano/api/tiempo_semana", true);
xmlhttp.send();
//https://my-json-server.typicode.com/raulserrano/api/tiempo_semana
/*var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var myObj = JSON.parse(this.responseText);
//document.getElementById("miEspacio").innerHTML = myObj[0].dia;
// Obteniendo todas las claves del JSON
for (var miDia in myObj){
// Controlando que json realmente tenga esa propiedad
if (myObj.hasOwnProperty(miDia)) {
// Mostrando en pantalla
document.write(dias_semana[miDia]+"<br>");
//alert("El dia es " + miDia);
}
}
}
};
xmlhttp.open("GET", "https://my-json-server.typicode.com/raulserrano/api/tiempo_semana", true);
xmlhttp.send()^*/
</script>
</body>
</html>
Valora esta pregunta


0