<body>
//首先得把架子搭起来
<table id = "tb" border="1">
<tr></tr>
<tr></tr>
</table>
//js部分
<script>
//简单的json内容
var json = {"姓名":"张三","年龄":"26","性别":"男"};
//获取tr
var tr = document.getElementsByTagName('tr');
//tr1和tr2下面会用到，但是要先声明，给一个空值
var tr1 = '';
var tr2 = '';
//用for in来进行遍历，k是键，json[k]是值
for(var k in json){
tr1+='<th>'+k+'</th>';
tr2+='<td>'+json[k]+'</td>';
}
//tr1里放的是键，也就是姓名，年龄，性别，然后把这些信息放到第一个tr里
tr[0].innerHTML = tr1;
//tr2里放的是值，也就是张三，26，男，把这些信息放到第二个tr里
tr[1].innerHTML = tr2;
</script>Je pensais à la façon de mettre dynamiquement du contenu json dans un tableau ? Parfois, on me posera la question lors des entretiens. Bien sûr, la question lors de l'entretien est de savoir comment le faire en utilisant ajax. Mais je vais écrire une démo simple ici et mettre le json existant dans un tableau. J'ai fait cette démo plusieurs fois. Même si elle est placée dans un tableau à chaque fois, cela semble très bizarre. Il peut s'agir d'une disposition verticale, comme celle-ci
.Nom
Zhang San
Âge
26
Genre
Homme
Ça pourrait être comme ça
Nom
Âge
Genre
Zhang San
26
Homme
Mais c'est ce que je veux
Nom Âge Sexe
Zhang San 26 ans, homme
Après plusieurs expériences, j'ai constaté que je devais apporter des ajustements à la structure du squelette HTML. Il n'est pas possible de simplement mettre la balise table au début, je dois ajouter deux balises tr. deux balises tr pour obtenir le résultat souhaité L'effet souhaité
L'article ci-dessus sur la façon d'afficher un fichier json dans un tableau [code d'implémentation] est tout le contenu partagé par l'éditeur. J'espère qu'il pourra vous donner une référence, et j'espère que vous soutiendrez Script Home.
tableau d'insertion de mots
Moyenne du tableau
Tableau de mots réparti sur plusieurs pages
Supprimer les tables redondantes dans le tableau
largeur de décalage
La différence entre une pression sur une touche et une touche enfoncée
Méthode d'affectation de tableau de chaînes
Le rôle du système d'exploitation Linux
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
