在不使用jQuery

时间:2016-02-19 19:20:03

标签: javascript html json

我正在尝试从Watson获取JSON对象输出并将其解析为可以添加到字符串的HTML表,该字符串将作为电子邮件发送。 我尝试使用几个插件,如json2html,但似乎无法让它们中的任何一个工作。

我的JSON对象如下所示:

 WATSON TONE: {
   "document_tone": {
     "tone_categories": [
       {
         "tones": [
           {
             "score": 0.15756,
             "tone_id": "anger",
             "tone_name": "Anger"
           },
           {
             "score": 0.192775,
             "tone_id": "disgust",
             "tone_name": "Disgust"
           },
           {
             "score": 0.186713,
             "tone_id": "fear",
             "tone_name": "Fear"
           },
           {
             "score": 0.255821,
             "tone_id": "joy",
             "tone_name": "Joy"
           },
           {
             "score": 0.207131,
             "tone_id": "sadness",
             "tone_name": "Sadness"
           }
         ],
         "category_id": "emotion_tone",
         "category_name": "Emotion Tone"
       },
       {
         "tones": [
           {
             "score": 0,
             "tone_id": "analytical",
             "tone_name": "Analytical"
           },
          {
             "score": 0,
             "tone_id": "confident",
             "tone_name": "Confident"
           },
           {
             "score": 0,
             "tone_id": "tentative",
             "tone_name": "Tentative"
           }
         ],
         "category_id": "writing_tone",
         "category_name": "Writing Tone"
       },
       {
         "tones": [
           {
             "score": 0.803,
             "tone_id": "openness_big5",
             "tone_name": "Openness"
           },
           {
             "score": 0.56,
             "tone_id": "conscientiousness_big5",
             "tone_name": "Conscientiousness"
           },
           {
             "score": 0.149,
             "tone_id": "extraversion_big5",
             "tone_name": "Extraversion"
           },
           {
             "score": 0.012,
             "tone_id": "agreeableness_big5",
             "tone_name": "Agreeableness"
           },
           {
             "score": 0.387,
             "tone_id": "neuroticism_big5",
             "tone_name": "Emotional Range"
           }
         ],
         "category_id": "social_tone",
         "category_name": "Social Tone"
       }
     ]
   }
 }

我试图将它附加在一个看起来像这样的字符串中。

emailText = '<html><body><h2>Original Email: </h2><p>' + watsonInput + '</p> <h2>Results: </h2><p>' + jsonOutput + ' </p></body></html>';

我有点迷失在这里并且已经看过几个关于SO的问题,但根据之前的答案无法弄清楚,因为许多人建议使用各种jQuery插件。

感谢任何帮助/建议, 感谢

1 个答案:

答案 0 :(得分:2)

我很快就做了一个粗略的例子,告诉你如何去做你需要的事情。见下文:

var json = '{ "watson_tone" : [' +
'{ "score": 0.1231 , "tone_id":"fear" },' +
'{ "score": 0.1235 , "tone_id":"sadness" },' +
'{ "score": 0.1236 , "tone_id":"disgust" } ]}';

// Parse the JSON so we can access what we need.
var parsed = JSON.parse(json);

// Get the amount of objects inside 'watson_tone' so we can loop through each one.
var count = Object.keys(parsed.watson_tone).length;

// Make some strings to include in our output.
var tableHeader = "<table><tr><th>score</th><th>tone_id</th></tr>";
var tableContent = "";

// Loop through the JSON and output each row in to a string.
for(i = 0; i < count; i++) {
    tableContent = tableContent + "<tr><td>" + parsed.watson_tone[i].score + "</td><td>" + parsed.watson_tone[i].tone_id + "</tr>";
}

var tableFooter = "</table>";

// Get div and output the HTML. You can include these HTML strings straight in to your emailText variable.
document.getElementById("your_table").innerHTML = tableHeader + tableContent + tableFooter;

所以你收到你的JSON,然后解析它。

接下来你计算它,准备你的HTML输出并循环遍历JSON中的每个记录(根据需要)并将其附加到输出。

现在您有一个包含所需HTML的变量(或变量)。

祝你好运!