3

我有这样的数组值。我想在 HTML 表格标签中显示这些值

<script type="text/javascript">
var orderArray = [
    ["1","29-Aug-2012", "Product1", "client1"],
    ["2","29-Aug-2012", "Product2", "client2"],
    ["3","29-Aug-2012", "Product3", "client3"],
    ["4","29-Aug-2012", "Product4", "client4"],
    ["5","29-Aug-2012", "Product5", "client5"]
    ];

function display()
{
    for(i=0;i<ordertArray.length;i++)
    {
    //How to display values of array inside the div or table tag ???
    }
}

</script>


如何在 div 或 table 标签内显示数组的值???


使用非模态对话框,并调用 dialog.setAlwaysOnTop(true); 希望这可以帮助

4

4 回答 4

6

orderArray的item代表<tr>元素,里面的每个item代表一个<td>元素。因此,您可以循环orderArray创建<tr>s,然后在创建 s 的每个循环中遍历其元素:http <td>: //jsfiddle.net/h7F7e/

var table = document.getElementById("table");  // set this to your table

var tbody = document.createElement("tbody");
table.appendChild(tbody);
orderArray.forEach(function(items) {
  var row = document.createElement("tr");
  items.forEach(function(item) {
    var cell = document.createElement("td");
    cell.textContent = item;
    row.appendChild(cell);
  });
  tbody.appendChild(row);
});
于 2012-08-29T13:15:16.723 回答
2

像这样的东西会为你创建一个动态表:

// get handle on div
var container = document.getElementById('container');
// create table element
var table = document.createElement('table');
var tbody = document.createElement('tbody');
// loop array
for (i = 0; i < orderArray.length; i++) {
    // get inner array
    var vals = orderArray[i];
    // create tr element
    var row = document.createElement('tr');
    // loop inner array
    for (var b = 0; b < vals.length; b++) {
        // create td element
        var cell = document.createElement('td');
        // set text
        cell.textContent = vals[b];
        // append td to tr
        row.appendChild(cell);
    }
    //append tr to tbody
    tbody.appendChild(row);
}
// append tbody to table
table.appendChild(tbody);
// append table to container
container.appendChild(table);

用途document.createElement()element.appendChild()

这里的工作示例

于 2012-08-29T13:18:48.893 回答
2

使用表格元素的 DOM 函数:

function display() {
    var table = document.createElement("table");
    for (var i=0; i<orderArray.length; i++) {
        var row = table.insertRow();
        for (var j=0; j<orderArray[i].length; j++) {
            var cell = row.insertCell();
            cell.appendChild(document.createTextNode(orderArray[i][j]));
        }
    }
    return table;
}

当 DOM 准备好时调用该函数,并将返回的表附加到某处。

于 2012-08-29T13:20:24.507 回答
1
var table = "<table>"; // Open Table

for(i=0; i<orderArray.length; i++)
{
 table += "<tr>"; // Open Row

 for(i2=0; i2<orderArray[i].length; i2++) {
 {
  table += "<td>" + orderArray[i][i2] + "</td>"; // Each Column
 }

 table += "</tr>"; // Close Row
}

table += "</table>"; // Close Table 
于 2012-08-29T13:17:58.767 回答