Question

我无法弄清楚为什么这不会在我的HTML中显示。

我已按照以下示例...

https://www.mkyong.com/javascript/how-to-access-json-object-in-javascript/

http://www.w3schools.com/js/js_json_intro.asp

我似乎无法弄清楚我哪里出错了。

这就是我现在所做的事情：

window.onload = function() {
    var json = { "year" : "2016",
        "months"  : [ {"July"}, {"August"}, {"September"} ],
        "days" : [ {02}, {03}, {14}, {18}, {10}, {19} ],
        "event" : [ {"Fitness assessment"}, {"Pathology-Uric Acid"}, {"Consultation-General and angiogram"}, {"Medication-Asperlone"}, {"Medication-Celestamine"}, {"Fitness assessment"} ] 
    };

    var obj = JSON.parse(json);
    document.getElementById("month").innerHTML = obj.months[0];
    document.getElementById("day").innerHTML = obj.days[0];
    document.getElementById("event").innerHTML = obj.event[0];
    document.getElementById("day2").innerHTML = obj.days[1];
    document.getElementById("event2").innerHTML = obj.event[1];
    document.getElementById("month2").innerHTML = obj.months[1];
    document.getElementById("day3").innerHTML = obj.days[2];
    document.getElementById("event3").innerHTML = obj.event[2];
    document.getElementById("day4").innerHTML = obj.days[3];
    document.getElementById("event4").innerHTML = obj.event[3];
    document.getElementById("day5").innerHTML = obj.days[4];
    document.getElementById("event5").innerHTML = obj.event[4];
    document.getElementById("month3").innerHTML = obj.months[2];
    document.getElementById("day6").innerHTML = obj.days[5];
    document.getElementById("event6").innerHTML = obj.event[5];
};

HTML片段：

<div class="row liketablerow">
    <div class="col-xs-2">
        <h4 id="day"></h4>
    </div>
    <div class="col-xs-2">
        <img src="images/icon-fitness.png" class="fitness" >
    </div>
    <div class="col-xs-2">
        <p id="event"></p>
    </div>
</div>

所有有用的评论都很有帮助，谢谢。

Answer 1

你的＆＃34; JSON＆＃34;实际上并不是JSON。它是一个JavaScript对象。因此，JSON.parse不会做任何事情（除了休息）。它已经采用您需要的格式。

        var obj = { "year" : "2016",
         "months"  : [ {"July"}, {"August"}, {"September"} ],
         "days" : [ {02}, {03}, {14}, {18}, {10}, {19} ],
         "event" : [ {"Fitness assessment"}, {"Pathology-Uric Acid"}, {"Consultation-General and angiogram"}, {"Medication-Asperlone"}, {"Medication-Celestamine"}, {"Fitness assessment"} ] };

^^更改为obj

请参阅此处了解JSON和JS对象文字之间的差异：

Answer 2

您的json对象无效，您使用大括号中的字符串使用大括号，这不是使用json notation执行此操作的正确方法，以下是它应该如何：

var json = {
  "year" : "2016",
  "months": ["July", "August", "September"],
  "days": [02, 03, 14, 18, 10, 19],
  "event": ["Fitness assessment", "Pathology-Uric Acid", "Consultation-General and angiogram", "Medication-Asperlone", "Medication-Celestamine", "Fitness assessment" ]};

Answer 3

javascript对象表示法似乎是错误的。您的事件JS对象语法应该在下面：

var json = { "year" : "2016",
        "months"  : [ "July", "August", "September" ],
        "days" : [ 02, 03, 14, 18, 10, 19 ],
        "event" : [ "Fitness assessment", "Pathology-Uric Acid", "Consultation-General and angiogram", "Medication-Asperlone", "Medication-Celestamine", "Fitness assessment" ] 
    };

在javascript中访问json并在html中显示它

3 个答案: