Utilisez JavaScript pour implémenter un exemple de code similaire aux compétences ListBox function_javascript

Lorsque JavaScript demande et traite plusieurs données, de nombreux programmeurs ont souvent du mal à les implémenter. Comment modifier et supprimer dynamiquement sans affecter d'autres éléments de données. Aujourd'hui, nous introduisons une méthode de référence. Par exemple, demandez ce qui suit via XmlRequest Data. 🎜>

Copier le code Le code est le suivant :

{ "Table":
[
{ "Id": 3, "Type": "X",
"Content": "Le rapport du 18e Congrès national du Parti communiste Le parti de mon pays a souligné que notre peuple Quelles sont les formes importantes de démocratie ? »,
« Akey » : « Système politique démocratique de base », « Bkey » : « Système du Congrès populaire »,
« Ckey » : "Système de coopération multipartite", "Dkey" " : null, "NUM ": 3 },
{ "Id": 2, "Type": "X", "Content": "L'antilope tibétaine est une antilope nationale animal protégé de premier niveau et est un animal unique de ()",
"Akey": "Plateau Qinghai-Tibet", "Bkey": "Xinjiang",
"Ckey": "Qinghai", "Dkey ": null, "NUM": 2 },
{ "Id" : 1, "Type": "X", "Content": "La protection des animaux sauvages a de nombreuses significations, et ce qui n'en fait pas partie l'est" ,
"Akey": "Effet environnemental", "Bkey": "Valeur culturelle",
"Ckey": "Affichage de la valeur", "Dkey": null, "NUM": 1 }
]
}

Comment corriger Ils s'affichent en HTML et mettent en œuvre un travail d'édition et de suppression, qui implique une analyse json et un affichage hiérarchique des données :

Affichage HTML tag :

JavaScript analyse les données et affiche :

Copier le code Le code est le suivant :

xmlHttp.responseText;
eval("var result =" réponse);
var len = result.Table.length;
if (len > 0) {
var msg = ""; 🎜>for (var i = 0; i < len; i ) {
msg = "

" result.Table[i].Content ""
msg = "" résultat.Table[i].Akey "< /span>"; ";
msg = "" résultat.Table[i]. Ckey "";
msg = "" résultat.Table[i].Dkey "< ;/span>";
msg = "Edit";
msg = " Supprimer"
msg = "< /li>";
}
document.getElementById("msg ").innerHTML = msg;
}


Chaque élément de données peut être traité via les fonctions editSub(id) et Delete(id) pour obtenir des fonctions similaires à ListBox .