开始JavaScript -创建表



我必须使用for循环创建一个数组来生成数字0-24。然后使用for循环在5x5的"表"中按顺序打印这些数字。

输出应为:0 1 2 3 4 x 5 6 7 8 9 x 10 11 12 13 14 x... 20 21 22 23 24

我不知道如何创建这个表。

下面是我的代码:
// Calculate numbers 0-24
var numbers = [];
for (var 0; i < 25; i++) {
    numbers[i] = i;
}

// Create table
for (var row = 0; row < 4; row++) {
    document.write('<tr>');
    for (var col = 0; col < 4; col++) {
        document.write('<td>' + numbers + '</td>');
    }
    document.write('</tr>');
}

问题是您在没有任何索引的情况下访问数组。试试这个:

var numbers = [];
for ( var 0; i<25; i++)
{
   numbers[i]= i;
}

//Create table
var i = 0;
var table = "<table>";
for (var row=0; row<5; row++)    //Changed from 4 to 5
{
   table += "<tr>";
   for (var col=0; col<5; col++)    //Changed from 4 to 5
   {
      table += "<td>" + numbers[i] + "</td>";    //numbers to numbers[i]
      i++;
   }
   table += "</tr>";
}
table += "</table>";
document.write(table);

更新:根据@Jon p的回答,我更新了我的答案,只写一次

这看起来像是家庭作业,所以我将提出一些建议,而不是给出正确的答案。

不要使用document.write

使用HTML在页面上创建一个表存根,并给它一个ID。了解如何通过id获取元素。了解如何更新该元素的内部html。只更新文档一次。

使用Firefox的Firebug或Chrome的Developer工具等工具检查呈现到页面的内容,以便您可以找出错误(或正确)。

从这里开始搜索知识:https://developer.mozilla.org/en-US/docs/Web/JavaScript

在%操作符
的帮助下,您可以在不嵌套For循环的情况下完成此操作。

这太过分了,但也许您会发现这些函数很有用!

// creates an array that contains a sequence of numbers from 0 to size-1
function range(size) {
    size = Math.max(0, size);
    var result = [];
    while (size--) { result.unshift(size); }
    return result;
}
// splits an array into chunks of a certain size.
function chunk(array, size) {
    if (!array || !array.length || size < 1) { return array };
    return [array.slice(0, size)].concat(chunk(array.slice(size), size));
}
// takes a 2D array and converts it to an HTML table.
function createHTMLTable(table) {
    var html = table.map(function(row) {
        row = row.map(function(cell) { return "<td>"+ cell +"</td>"; });
        row = row.join('');
        return "<tr>"+ row +"</tr>";
    });
    html = html.join('');
    return "<table>"+ html +"</table>";
}
function renderHTML(html) {
    document.write(html);
}
var numbers   = range(25);
var table     = chunk(numbers, 5);
var tableHTML = createHTMLTable(table);
renderHTML(tableHTML);

最新更新