将多个 JSON 数据转换为 HTML 表 [重复]

Posted 2023-03-05

【中文标题】将多个 JSON 数据转换为 HTML 表 [重复]

【英文标题】：Convert multiple JSON Data into HTML table [duplicate]

【发布时间】：2018-12-16 00:55:25

【问题描述】：

我在 html 和 CSS 方面有一些丰富的经验，但在 JS 和 Jquery 方面经验不多，我希望将 JSON 数据（在我的情况下为文本和图像）放入 HTML 表中，但经过几天的研究似乎没有任何效果对我来说，这是 JSON 数据。

[
 
    "event": "ESL One Cologne 2018",
    "maps": "bo3",
    "team1": 
       "name": "Astralis",
       "crest": "https://static.hltv.org/images/team/logo/6665",
       "result": 1
   ,
   "team2": 
       "name": "Natus Vincere",
       "crest": "https://static.hltv.org/images/team/logo/4608",
       "result": 2
   ,
   "matchId": "/matches/2324404/astralis-vs-natus-vincere-esl-one-cologne-2018"
 ,
 
    "event": "Americas Minor - FACEIT Major 2018",
    "maps": "bo3",
    "team1": 
       "name": "eUnited",
       "crest": "https://static.hltv.org/images/team/logo/7106",
       "result": 2
     ,
     "team2": 
       "name": "Não Tem Como",
       "crest": "https://static.hltv.org/images/team/logo/6267",
       "result": 0
    ,
    "matchId": "/matches/2324618/eunited-vs-no-tem-como-americas-minor-faceit-major-2018"
,

到目前为止，我尝试了很多不同的代码，但似乎没有任何效果，因为 1）我不知道如何在“团队 1”和“团队 2”字段中选择字段“名称”，并且 2）我不知道不知道你是否真的可以把球队的形象放在球队名称旁边。 希望您的建议中至少有一个有效。 谢谢

【问题讨论】：

您说：“经过几天的搜索”-但这对于任何 JS 编程来说都是基本的吗？有大量的资源可供学习，这很简单。

将图片放在团队名称附近是什么意思？

试试这个：sitepoint.com/dynamic-tables-json

请显示您尝试过的“不同代码”。还请说明您的研究将引领您走向何方。

请指定表格、列、行等的格式

【参考方案1】：

您可以使用 JSON.parse(your_json); 将 JSON 转换为 javascript 对象

我不确定你想如何格式化表格中的数据，所以我帮不上忙，但它是非常简单的 JavaScript