顯示的JavaScript對象數組的什麼，我試圖做

只是快速簡單的例子：顯示的JavaScript對象數組的什麼，我試圖做

Salamander = { 
    Name: getName(), 
    SvLength: getSvLength(), 
    TotLength: getTotLength() 
}; 

aSal.push(Salamander);

什麼是顯示在屏幕上可變數量的蠑螈數據的最佳方式？數組中可以有一個不加區分的數字。

什麼是HTML標記甚至像這樣的東西？我怎麼編寫它的數據填充？

來源

2012-05-06 Brendan

有三列的表？這完全取決於你... –

但是，這不行嗎？我需要爲每件物品創建一個全新的嗎？我只是對如何用桌子做出混淆。 – Brendan

@Brendan你把它留給模板引擎（Handlebars＆co。）。這個想法是讓模板引擎生成一個HTML源代碼字符串，然後您只需將該HTML字符串附加到頁面（通過jQuery）。 –

如果您不知道元素數量或其他任何事情，則需要動態創建HTML。

做這樣的事情，你怎麼做您的標記我們給你，但你明白了一點：

var output; 

$.each(aSal, function(index, item) { 
    output += '<ul class="salamander_wrapper">'; 
    output += '<li class="name">'+this.Name+'</li>'; 
    output += '<li class="length">'+this.SvLength+'</li>'; 
    output += '<li class="tot_length">'+this.TotLength+'</li>'; 
    output += '</ul>'; 
}); 

$(output).appendTo('body');

FIDDLE

來源

2012-05-06 22:16:19 adeneo

是的，只是一個例子，但我會改變它嗎？我甚至添加了一個小提琴！ – adeneo

我假設你有一個Salamander對象的集合，並且你想找到一個特定對象的蠑螈對象的索引。

你可以使用一個for循環迴路，該項目具有特定屬性：

function getIndexForName(name) { 
    for(var i = 0; i < aSal.length; i++) { 
     if(aSal[i].Name == name) { 
      return i; 
     } 
    } 
    return -1; // not found 
}

要在表格中顯示整個陣列，您可以通過循環for循環和填充表TD手機通過首先在頁面上克隆HTML模板，然後使用jQuery動態添加數據。這種技術的優點是您可以執行此操作而無需在服務器端生成HTML。

<table id="salamanders"> 
    <tr> 
     <th>Index</th> 
     <th>Name</th> 
     <th>SvLength</th> 
     <th>TotLength</th> 
    </tr> 
    <tr class="item"> 
     <td></td> 
    </tr> 
</table> 

var tr = $('#salamanders').find("tr:last").clone(); 
var td = $('#salamanders').find("td").clone(); 


$('#salamanders').find("td").remove(); 
$('#salamanders').find("tr:last").remove(); 

for(var i = 0; i < aSal.length; i++) { 
    // clone the tr element from earlier and insert into the table. 
    $('#salamanders').append(tr.clone()); 

    // insert the index 
    $('#salamanders').find("tr:last").append(td.clone()); 
    $('#salamanders').find("td:last").innerHTML = i; 

    // insert the name 
    $('#salamanders').find("tr:last").append(td.clone()); 
    $('#salamanders').find("td:last").innerHTML = aSal[i].Name; 

    // insert SvLength 
    $('#salamanders').find("tr:last").append(td.clone()); 
    $('#salamanders').find("td:last").innerHTML = aSal[i].SvLength; 

    // insert TotLength 
    $('#salamanders').find("tr:last").append(td.clone()); 
    $('#salamanders').find("td:last").innerHTML = aSal[i].TotLength;  
}

這應該肯定有助於開始。

來源

2012-05-06 22:15:15 jmort253

看一看這個小提琴：

http://jsfiddle.net/8EkQ5/

有閃爍的w ays使用例如javascript模板來做到這一點。但是這對你的情況似乎是足夠的。

片段在這裏：

var tableHtml = "<table border='1'>"; 
for (var i = 0; i < rando; i++) { 
    tableHtml += "<tr><td>"+newArray[i]+"</td></tr>"; 
} 
tableHtml += "</table>"; 

document.getElementById("tableholder").innerHTML = tableHtml;

來源

2012-05-06 22:17:00 Marc

顯示的JavaScript對象數組的什麼，我試圖做

回答

相關問題