javascript - 不使用 jQuery 解析 json 并在 HTML 代码中添加值

Question

首先:我不想使用 jQuery。

我想找到一种方法来解析这种类型的 json 并将其文本添加到特殊标记中:

{
    "datas": {
        "General": [
            {
                "id": "hotel_name",
                "value": "My Hotel name"
            },
            {
                "id": "hotel_description",
                "value": "Lorem ipsum dolor..."
            }
        ],
        "Photos": [
            {
                "id": "photo1",
                "value": "house.png"
            },
            {
                "id": "photo2",
                "value": "house.png"
            }
        ]
    }
}

在 HTML 上我有特殊标签:

<mytag id="hotel_name"></mytag>

必须成为:

<mytag id="hotel_name">My Hotel name</mytag>

我尝试过这个:

function createElements(elements) {
    elements = JSON.parse(elements);

    elements.forEach(funciton (element) {
        var div = document.getElementById(element.id);
        div.innerHTML = element.text;
    });
}

var request = new XMLHttpRequest();

request.onload = createElements;
request.open("get", "datas.json", true);
request.send();

但它并没有像我想要的那样工作。

你有什么提示吗？

谢谢。

Answer 1

我认为你的意思是:

elements.datas.General.forEach(function (element) {
    var div = document.getElementById(element.id);
    div.innerHTML = element.text;
});

您必须先解析每个 JSON 属性，然后才能循环数组。