如何在Javascript中使用JSON數據

Question

我是javascript的新手，因此真的不知道如何問我要問的問題。 這樣做的目的是要道歉，如果這是一個重復的問題。 話雖如此，我偶然發現了該站點，並希望利用此處討論的方法。 鑒於我對此類工具的使用案例將涉及使用Python或R動態生成JSON，我想知道如何

a）適當地生成JSON。

b）將其與<script>標記集成在一起，使其成為Javascipt中的JSON對象。

這是我現在擁有的代碼：

html <- paste('<head><link title="timeline-styles", rel="stylesheet" href="//cdn.knightlab.com/libs/timeline3/latest/css/timeline.css"><script src="//cdn.knightlab.com/libs/timeline3/latest/js/timeline.js"></script></head><body><div id="timeline-embed" style="width: 100%; height: 600px"></div><script type="text/javascript">var timeline_json=', readr::read_lines("~/projects/timelineJS/trial.json") %>% paste(collapse=''),'; window.timeline=new TL.Timeline("timeline-embed", timeline_json);</script></body>', sep='')
write(html, file="~/projects/timelineJS/test.html")

輸出似乎是我想要的（下面的輸出已清理）：

<head>
  <link title="timeline-styles" rel="stylesheet" href="//cdn.knightlab.com/libs/timeline3/latest/css/timeline.css">
  <script src="//cdn.knightlab.com/libs/timeline3/latest/js/timeline.js"></script>
</head>
<body>
  <div id="timeline-embed" style="width: 100%; height: 600px"></div>
  <script type="text/javascript">
    var timeline_json={"title": {"media": {"url": "//www.flickr.com/photos/tm_10001/2310475988/", "caption": "Whitney Houston performing on her My Love is Your Love Tour in Hamburg.", "credit": "flickr/<a href='http://www.flickr.com/photos/tm_10001/'>tm_10001</a>"}, "text": {"headline": "Whitney Houston<br/> 1963 - 2012", "text": "<p>Houston's voice caught the imagination of the world propelling her to superstardom at an early age becoming one of the most awarded performers of our time. This is a look into the amazing heights she achieved and her personal struggles with substance abuse and a tumultuous marriage.</p>"}}, "events": ["media": {"url": "https://youtu.be/fSrO91XO1Ck", "caption": "", "credit": "<a href=\"http://unidiscmusic.com\">Unidisc Music</a>"}, "start_date": {"year": "1978"}, "text": {"headline": "First Recording", "text": "At the age of 15 Houston was featured on Michael Zager's song, Life's a Party."}]};
    window.timeline = new TL.Timeline("timeline-embed", timeline_json);
  </script>
</body>

但是，當我加載html文件時，它只是一個空白屏幕。 我不知道自己在做什么方面做得很好，無法知道從哪里開始調試，因此朝着正確方向提供的任何幫助將不勝感激。 謝謝！

Answer 1

事件必須是對象數組。

普通數組將僅包含一個值，即Days = [ "mon", "tues" .... } 。

一個對象可以保存多條信息（甚至是功能）。

您需要告訴JavaScript您要使用array []，並且此數組包含多個對象{}，所以最終得到[{},{},{},{}] 。

使用您之前的代碼，您告訴JSON解析器期望一個數組。 解析器查找直到：的值。 由於這不是數組定界符，因此會導致解析器拋出錯誤

"events": [
  "media": {
     "url": "https://youtu.be/fSrO91XO1Ck", 
     "caption": "", 
     "credit": "<a href=\"http://unidiscmusic.com\">Unidisc Music</a>"
  }, 
  "start_date": {"year": "1978"}, 
  "text": {
     "headline": "First Recording", 
     "text": "At the age of 15 Houston was featured on Michael Zager's song, Life's a Party."
  }
]

此代碼告訴解析期望一個數組[下一個符號用於對象。 因此，解析器將期望包含一個或多個對象的數組。

"events": [{
  "media": {
     "url": "https://youtu.be/fSrO91XO1Ck", 
     "caption": "", 
     "credit": "<a href=\"http://unidiscmusic.com\">Unidisc Music</a>"
  }, 
  "start_date": {"year": "1978"}, 
  "text": {
     "headline": "First Recording", 
     "text": "At the age of 15 Houston was featured on Michael Zager's song, Life's a Party."
  }
}]

解析器如果非常挑剔。 如果發現錯誤，它將停止處理數據。 確保查看瀏覽器控制台日志（F12和控制台-在Chrome中）。

如何在Javascript中使用JSON數據

問題描述

1 個解決方案

解決方案1
1 已采納 2015-09-22 05:27:53

如何在Javascript中使用JSON數據

問題描述

1 個解決方案

解決方案1 1 已采納 2015-09-22 05:27:53

解決方案1
1 已采納 2015-09-22 05:27:53