在JSON中循環數組的最佳方式是什麼？

Question

所以我有一個JSON文件，其中有一個偏差數組。我想遍歷每個總線和div的，像這樣顯示出來：

<div class="bus"> 
    <div class="line">departure.line</div> 
    <div class="direction">departure.direction</div> 
    <div class="time">departure.time</div> 
</div> 

每個輸入總線都有它自己的總線分度，它裏面的所有相關信息。我已經得到儘可能顯示其中之一，但我不知道如何迭代它們並將它們顯示在正確的位置。

我打算利用香草JavaScript或jQuery。

下面是與數組的jsfiddle我想遍歷：http://jsfiddle.net/tmm7b31w/

Answer 1

你要使用的每一個，就像這樣：

HTML

<div class="bus prototype"> 
    <div class="line"></div> 
    <div class="direction"></div> 
    <div class="time"></div> 
</div> 

的JavaScript（用jQuery ）

var parent = $('body'); 
var prototype = $('.bus.prototype'); 

$.each(data.departures, function(index, departure) { 
    var bus_div = prototype.clone(); 

    bus_div.find('.line').text(departure.line); 
    //etc... 

    parent.append(bus_div); 
}); 

你也可以用一個香草JavaScript來做循環。

for (var i = 0; i < data.departures.length; i++) { 
    var departure = data.departures[i]; 

    var bus_div = prototype.clone(); 

    bus_div.find('.line').text(departure.line); 
    //etc... 

    parent.append(bus_div); 
} 

Answer 2

你需要一個foreach循環來簡單地通過元素。見下面的示例：

$.each(item, function(index1, item1){ 
    var divContent = 
     '<div class="line">' + item1.line + '</div>' + 
     '<div class="direction">' + item1.direction + '</div>' + 
     '<div class="time">' + item1.aimed_departure_time + '</div>'; 

     $('#container').append(divContent); 
}); 

我已經更新了你的提琴here。