Cuando JavaScript solicita y procesa varios datos, a muchos programadores a menudo les preocupa cómo implementarlos y cómo editarlos y eliminarlos dinámicamente sin afectar otros elementos de datos. Hoy presentamos un método como referencia, por ejemplo, a través de XmlRequest.
Copie el código de código de la siguiente manera:
<span style="font-size:14px;">{ "Tabla":
[
{ "Id": 3, "Tipo": "X",
"Contenido": "El informe del XVIII Congreso Nacional del Partido Comunista de China señaló que ¿cuáles son las formas importantes de democracia popular en nuestro país?",
"Akey": "Sistema político democrático de base", "Bkey": "Sistema de Congreso del Pueblo",
"Ckey": "Sistema de cooperación multipartidista", "Dkey": nulo, "NUM": 3 },
{ "Id": 2, "Type": "X", "Content": "El antílope tibetano es un animal protegido nacional de primer nivel y es un animal único de ()",
"Akey": "Meseta Qinghai-Tíbet", "Bkey": "Xinjiang",
"Ckey": "Qinghai", "Dkey": nulo, "NUM": 2 },
{ "Id": 1, "Type": "X", "Content": "Proteger a los animales salvajes tiene muchos significados, y lo que no forma parte de ello sí lo es",
"Akey": "Efecto Ambiental", "Bkey": "Valor Cultural",
"Ckey": "Ver valor", "Dkey": nulo, "NUM": 1 }
]
}</span>
Cómo mostrarlos en HTML e implementar el trabajo de edición y eliminación, que implica el análisis json y la visualización jerárquica de datos:
Etiqueta de visualización HTML:
<ul id="msg" nombre="msg"> </ul>
JavaScript analiza los datos y muestra:
Copie el código de código de la siguiente manera:
<span style="font-size:14px;"> var respuesta = xmlHttp.responseText;
eval("var resultado=" + respuesta);
var len = resultado.Table.length;
si (len > 0) {
var mensaje = "";
para (var i = 0; i < len; i++) {
msg += "<li><span>" + resultado.Tabla[i].Contenido + "</span>";
msg += "<span>" + resultado.Table[i].Akey + "</span>";
msg += "<span>" + resultado.Table[i].Bkey + "</span>";
msg += "<span>" + resultado.Table[i].Ckey + "</span>";
msg += "<span>" + resultado.Table[i].Dkey + "</span>";
msg += "<a href='###' onclick=/"editSub('" + resultado.Table[i].Id + "')/">Editar</a>";
msg += " <a href='###' onclick='Delete(" + result.Table[i].Id + ")'>Delete</a>";
mensaje += "</li>";
}
document.getElementById("msg").innerHTML = mensaje;
}</span>
Cada dato se puede procesar mediante las funciones editSub (id) y Delete (id) para lograr funciones similares a ListBox.