Question

有人可以告诉我我做错了吗？

我认为这是添加字符串的东西;

我也尝试过：

var column = $("<td></td>")

而不是：

var column = $("<td>")

等

并且HTML上的结果总是相同：＆＃34; [object Object]＆＃34;

我做错了什么？

$(function() {
    createTable(8); 
});


function createTableColumn() {
    var column = $("<td>");

    return column;
}

function createTableRow(gameBoardSize) {
    var columns = "";
    var row;

    for(counter = 0; counter < gameBoardSize; counter++) {
        columns = columns + createTableColumn();
    }

    row = $("<tr>").append(columns);
    return row;

}

function createTable(gameBoardSize) {

    var rows = "";

    for(counter = 0; counter < gameBoardSize; counter++) {
        rows += createTableRow(gameBoardSize);
    }


    $("#gameboard-table").append(rows);
}

Answer 1

您无意中使用+= createTableRow...执行字符串连接操作。将行更改为数组并使用push代替

var rows = [];
for(counter = 0; counter < gameBoardSize; counter++) {
    rows.push(createTableRow(gameBoardSize));
}

Answer 2

+用于连接字符串，而不是jQuery对象。

直接附加到jQuery对象：

function createTableRow(gameBoardSize) {
    var row = $("<tr>");
    for(var counter = 0; counter < gameBoardSize; counter++) {
        row.append(createTableColumn());
    }
    return row;
}

function createTable(gameBoardSize) {
    for(var counter = 0; counter < gameBoardSize; counter++) {
        $("#gameboard-table").append(createTableRow(gameBoardSize));
    }
}

确保为循环计数器使用局部变量。否则，for中的createTableRow循环会更新createTable中的计数器，这会导致该循环过早结束。

Answer 3

$(function(){
    createTable(8);
  var i=0;
  $('td').each(function(){
      i++;
    $(this).text(i);
  });
});

function createTable(number){
    for(var count = 0;count<number;count++){
        $('#gameboard-table').append('<tr>');
        $('tr').append('<td>');  
    }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<table id="gameboard-table"></table>

Answer 4

只是字符串连接和一个追加。

function createTable(rowsCount, columnsCount) {
    var rows = "";
    var cell = "";
    var table = $("<table />")
    for (var i = 0; i < columnsCount; i++) {
        cell += "<td></td>";
    }
     for (var i = 0; i < rowsCount; i++) {
         rows += "<tr>" + cell + "</tr>";
     }
     table.append(rows);
         return table;
}

jQuery - 如何动态打印空表

4 个答案: