我想將JSON對象中的特定內容顯示為表結構嗎？ 我怎樣才能做到這一點？

Question

{"symbol":"DRREDDY","series":"EQ","openPrice":"3,132.00","highPrice":"3,229.90","lowPrice":"3,132.00","ltp":"3,206.35","previousPrice":"3,153.25","netPrice":"1.68","tradedQuantity":"74,165","turnoverInLakhs":"2,379.33","lastCorpAnnouncementDate":"18-Jul-2016","lastCorpAnnouncement":"Annual General Meeting\/ Dividend - Rs 20\/- PerShare"},{"symbol":"ACC","series":"EQ","openPrice":"1,567.00","highPrice":"1,606.85","lowPrice":"1,564.85","ltp":"1,594.25","previousPrice":"1,568.10","netPrice":"1.67","tradedQuantity":"1,03,292","turnoverInLakhs":"1,645.62","lastCorpAnnouncementDate":"22-Feb-2016","lastCorpAnnouncement":"Dividend - Rs 6\/- Per Share"},
{"symbol":"ACC","series":"EQ","openPrice":"1,567.00","highPrice":"1,606.85","lowPrice":"1,564.85","ltp":"1,594.25","previousPrice":"1,568.10","netPrice":"1.67","tradedQuantity":"1,03,292","turnoverInLakhs":"1,645.62","lastCorpAnnouncementDate":"22-Feb-2016","lastCorpAnnouncement":"Dividend - Rs 6\/- Per Share"}

這是JSON對象，我想將所有符號名稱，高價位和低價位存儲在單獨的變量中，並在我的頁面中以符號，高價位和低價位作為表格結構單獨顯示在頁面中？ 我怎樣才能做到這一點 ？ 一次可以添加一個符號，但是我希望所有符號都顯示b嗎？

Answer 1

嘗試這個：

var data = [{
    "symbol":"DRREDDY",
    "series":"EQ",
    "openPrice":"3,132.00",
    "highPrice":"3,229.90",
    "lowPrice":"3,132.00",
    "ltp":"3,206.35",
    "previousPrice":"3,153.25",
    "netPrice":"1.68",
    "tradedQuantity":"74,165",
    "turnoverInLakhs":"2,379.33",
    "lastCorpAnnouncementDate":"18-Jul-2016",
    "lastCorpAnnouncement":"Annual General Meeting\/ Dividend - Rs 20\/- PerShare"
    },
    ...
];

var table = $('<table>');
table.append('<thead><tr><td>symbol</td><td>highPrice</td><td>lowPrice</td></tr></thead>');
for(var i in data){
    var tr = $('<tr>');
    var td1 = '<td>' + data[i].symbol;
    var td2 = '<td>' + data[i].highPrice;
    var td3 = '<td>' + data[i].lowPrice;
    tr.append(td1,td2,td3);
    table.append(tr);
}

$('#your-panel').append(table);

有Jsfiddle

Answer 2

假設您的對象存在於如下數組中

var arr = [{
    "symbol":"DRREDDY",
    "series":"EQ",
    "openPrice":"3,132.00",
    "highPrice":"3,229.90",
    "lowPrice":"3,132.00",
    "ltp":"3,206.35",
    "previousPrice":"3,153.25",
    "netPrice":"1.68",
    "tradedQuantity":"74,165",
    "turnoverInLakhs":"2,379.33",
    "lastCorpAnnouncementDate":"18-Jul-2016",
    "lastCorpAnnouncement":"Annual General Meeting\/ Dividend - Rs 20\/- PerShare"
},
{
    "symbol":"ACC",
    "series":"EQ",
    "openPrice":"1,567.00",
    "highPrice":"1,606.85",
    "lowPrice":"1,564.85",
    "ltp":"1,594.25",
    "previousPrice":"1,568.10",
    "netPrice":"1.67",
    "tradedQuantity":"1,03,292",
    "turnoverInLakhs":"1,645.62",
    "lastCorpAnnouncementDate":"22-Feb-2016",
    "lastCorpAnnouncement":"Dividend - Rs 6\/- Per Share"
},

{
    "symbol":"ACC",
    "series":"EQ",
    "openPrice":"1,567.00",
    "highPrice":"1,606.85",
    "lowPrice":"1,564.85",
    "ltp":"1,594.25",
    "previousPrice":"1,568.10",
    "netPrice":"1.67",
    "tradedQuantity":"1,03,292",
    "turnoverInLakhs":"1,645.62",
    "lastCorpAnnouncementDate":"22-Feb-2016",
    "lastCorpAnnouncement":"Dividend - Rs 6\/- Per Share"
}]

您可以遍歷數組以繪制行並遍歷對象以繪制列，如下所示

var tableData = ''
arr.map((x) => {
tableData += '<tr><td>' + x.highPrice + '</td><td>' + x.lowPrice + '</td></tr>';  
});
$('table').find('tbody').html(tableData)

Answer 3

迭代列表到表

var table = document.getElementById("myTable");
for(var i =0; i < data.length; i++) {
    var row = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2);
    cell1.innerHTML =  data[i].symbol;
    cell2.innerHTML = data[i].highPrice;
    cell3.innerHTML = data[i].lowPrice;
}

小提琴

Answer 4

您可能不需要為符號，highPrice和lowPrice創建單獨的數組。

相反，您可以使用forEach遍歷json數組並獲取每個項目

var _tbody = $('tbody');
_myJson.forEach(function(item){
var _tr = '<tr><td>'+item.symbol+'</td><td>'+item.highPrice+'</td><td>'+item.lowPrice+'</td></tr>'
_tbody+=_tr
})
$('#demoTable').append(_tbody)

JSFIDDLE

Answer 5

考慮

var result= {"symbol":"DRREDDY","series":"EQ","openPrice":"3,132.00","highPrice":"3,229.90","lowPrice":"3,132.00","ltp":"3,206.35","previousPrice":"3,153.25","netPrice":"1.68","tradedQuantity":"74,165","turnoverInLakhs":"2,379.33","lastCorpAnnouncementDate":"18-Jul-2016","lastCorpAnnouncement":"Annual General Meeting\/ Dividend - Rs 20\/- PerShare"},

{"symbol":"ACC","series":"EQ","openPrice":"1,567.00","highPrice":"1,606.85","lowPrice":"1,564.85","ltp":"1,594.25","previousPrice":"1,568.10","netPrice":"1.67","tradedQuantity":"1,03,292","turnoverInLakhs":"1,645.62","lastCorpAnnouncementDate":"22-Feb-2016","lastCorpAnnouncement":"Dividend - Rs 6\/- Per Share"},
{"symbol":"ACC","series":"EQ","openPrice":"1,567.00","highPrice":"1,606.85","lowPrice":"1,564.85","ltp":"1,594.25","previousPrice":"1,568.10","netPrice":"1.67","tradedQuantity":"1,03,292","turnoverInLakhs":"1,645.62","lastCorpAnnouncementDate":"22-Feb-2016","lastCorpAnnouncement":"Dividend - Rs 6\/- Per Share"}

var low_price,high_price,symbols=[];

for(var i=0; i<result.length; i++){
low_price[i]=result[i].lowPrice;
}

要在表中顯示u可以在for循環內使用顯示功能，例如：

for(var i=0; i<result.length; i++){
//low_price[i]=result[i].lowPrice;
display(result[i]);
}

function display(result){
var rows='<tr>'+
'<td>'+result.symbol+'</td>'+
'<td>'+result.highPrice+'</td>'+
'<td>'+result.lowPrice+'</td>'+
'</tr>';
$('#result').append(rows);

}

在html頁面

<div>
<table>
<thead>
<th>Symbols</th>
<th>High price</th>
<th>Low price</th>
</thead>
<tbody id="result">
// your display function will be add rows using append function ...
</tbody>
</table>
</div

我猜你在找這個..否則對不起錯誤的信息

請提供您想要的更多信息