html 的列表对象,如何在HTML页面上显示JSON对象的列表

注意：需要在不使用jQuery或任何其他开放源代码的情况下实现此目的。如何在HTML页面上显示JSON对象的列表

这里是我有什么

HTML：

Model

Browse all our products below:

Name:

Desc:

Cost:

Stock:

js.js低于

var getProducts = function(){

console.log("Getting Products...");

var success = function() {

var product = JSON.parse(xhr.responseText);

console.log(product);

document.getElementById("name").innerHTML = product.name;

document.getElementById("desc").innerHTML = product.desc;

document.getElementById("cost").innerHTML = product.cost;

document.getElementById("stock").innerHTML = product.stock;

}

};

xhr = new XMLHttpRequest();

xhr.open("GET", "back.php");

xhr.addEventListener("load", success);

xhr.send();

};

window.addEventListener("load", getProducts);

back.php从数据库返回以下。他们已经json_encoded：

{"name":"TESTPRODUCT","desc":"TESTIN12356879CEWBLABHDSB","cost":"123.45","stock":"6"}

{"name":"soot","desc":"soooottty black","cost":"980.00","stock":"10"}

{"name":"baby","desc":"chucky doll","cost":"7.92","stock":"34"}

{"name":"bob","desc":"fydrtsfxgcvnb","cost":"3546.00","stock":"978"}

{"name":"bolly","desc":"ball","cost":"77.00","stock":"89"}

我需要显示这些对象到HTML页面。我知道我需要实现一个for循环，无论我尝试什么，都会出现JSON的解析错误。

SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data at

line 1 column 86 of the JSON data

var product = JSON.parse(xhr.responseText);

如果有人能帮助我了解如何将所有JSON对象显示在html页面上，我们将非常感激。

2015-04-02

barthola

+0

验证您的JSON第一[JSONLint(http://jsonlint.com/) –

2015-04-02 22:10:25