Json轉化爲HTML未捕獲錯誤

Question

我正在嘗試使用json數據庫將大量數據讀取到使用jQuery的html文檔中。我現在使用的代碼如下：

$(document).ready(function($) { 
    $.getJSON("http://mtgjson.com/json/BNG.json", 
     function(data){ 
      console.log(data); 
       $.each(data.cards, function(i,card){ 
        content += '<p>' + card.name + '</p>'; 
        content += '<p>' + card.rarity + '</p>'; 
        content += '<p>' + card.manaCost + '</p>'; 
        content += '<p>' + card.type + '</p>'; 
        content += '<br/>'; 
       $(content).appendTo("#content"); 
       }); 
      }); 
}); 

的代碼似乎工作，因爲它返回我請求的數據（姓名，稀有性，耗魔和類型）它並沒有顯示它在div命名＃內容。它僅在DOM中顯示錯誤消息中的數據。

Uncaught Error: Syntax error, unrecognized expression: [object HTMLDivElement]<p>Acolyte's Reward</p><p>Uncommon</p><p>{1}{W}</p><p>Instant</p><br/> 

我認爲這是與追加$（內容）至（「＃內容」），但我真的很新成JSON，所以我不能爲我的生命數字出來。

是的，我有一個名爲#content的div在我的html之前有人問道。提前致謝。

編輯：根據要求控制檯日誌數據：

Object {name: "Born of the Gods", code: "BNG", releaseDate: "2014-02-07", border: "black", type: "expansion"…} 
block: "Theros" 
booster: Array[16] 
border: "black" 
cards: Array[165] 
code: "BNG" 
name: "Born of the Gods" 
releaseDate: "2014-02-07" 
type: "expansion" 
__proto__: Object 

Answer 1

你需要創建一個局部變量，貌似content指的是一些元素

$(document).ready(function ($) { 
    $.getJSON("http://mtgjson.com/json/BNG.json", function (data) { 
     console.log(data); 
     $.each(data.cards, function (i, card) { 
      var content = '<p>' + card.name + '</p>'; 
      content += '<p>' + card.rarity + '</p>'; 
      content += '<p>' + card.manaCost + '</p>'; 
      content += '<p>' + card.type + '</p>'; 
      content += '<br/>'; 
      $(content).appendTo("#content"); 
     }); 
    }); 
}); 

演示：Fiddle

在你的情況你有一個對象，編號爲content，所以全局變量content指的是dom eleme NT。這會導致字符串連接導致錯誤值