JSON -获取特定元素

Question

我需要一个js脚本来获取的值：'uuid‘和’排名‘的每个成员从JSON文件到HTML。

然后使用以下命令将UUID传输到用户名

https://api.mojang.com/user/profiles/(UUID value here)/names

https://api.mojang.com/user/profiles/4b71487207474374b7be97362d56fa17/names

并将名称显示为：

<div>
<h2>(NAME value here)</h2>
<h4>Rank: (RANK value here)</h4>
<img src="https://mc-heads.net/head/(UUID value here)"></img>
</div>

我的JSON代码：

{
    "success": "true",
    "guild": {
        "name": "name",
        "value1": "value1",
        "value2": "value2",
        "members": [
            {
                "uuid": "12345671",
                "rank": "rank"
            },
            {
                "uuid": "12345672",
                "rank": "rank"
            },
            {
                "uuid": "12345673",
                "rank": "rank"
            },
            {
                "uuid": "12345674",
                "rank": "rank"
            },
            {
                "uuid": "12345675",
                "rank": "rank"
            }
        ]
    }
}

Answer 1

在这里检查我的解决方案。我用name注释了这一行，因为我没有真正的uuid，但其余的似乎都可以工作。

​

const data = {
  "success": "true",
  "guild": {
    "name": "name",
    "value1": "value1",
    "value2": "value2",
    "members": [{
        "uuid": "12345671",
        "rank": "rank"
      },
      {
        "uuid": "12345672",
        "rank": "rank"
      },
      {
        "uuid": "12345673",
        "rank": "rank"
      },
      {
        "uuid": "12345674",
        "rank": "rank"
      },
      {
        "uuid": "12345675",
        "rank": "rank"
      }
    ]
  }
};

const root = document.getElementById("root")
data.guild.members.forEach((member) => {
  const newDiv = document.createElement("div");
  let newh2 = document.createElement("h2");
  let newh4 = document.createElement("h4");
  let newhImg = document.createElement("img");

  // fetch("https://api.mojang.com/user/profiles/" + member.uuid + "/names")
  // .then((response) => {
  //   return response.json();
  // })
  // .then((data) => {
  //   newh2.createTextNode = data[0].name;
  // });

  const textNode = document.createTextNode("Rank: " + member.rank);
  newh4.appendChild(textNode);

  newhImg.src = "https://mc-heads.net/head/" + member.uuid;

  newDiv.appendChild(newh2);
  newDiv.appendChild(newh4);
  newDiv.appendChild(newhImg);
  root.appendChild(newDiv);
});

<div id=root></div>

​