0

我正在尝试使用 JS 和 jQuery 动态创建一个表。（我知道我可以在 html 中对其进行硬编码，但我不想这样做。）
我在桌子上有一个额外的行，我无法删除。
有人可以提供关于如何在我的代码中最好地解决这个问题的答案吗？

我的代码发布在下面。

var game = {
    matrix: [],
    startGame: function()
    {
        this.doDomStuff(); //build board
    },
    doDomStuff: function(row, column)
    {
        for(var i = 0; i < 7; i++)
        {
            var row = $('<div>');
            row.attr('id', 'data-row' + (i + 1));
            row.addClass('data-row');
            for(var j = 0; j < 6; j++)
            {
                var column = $('<div>');
                column.attr('id', 'data-column' + (j + 1));
                column.addClass('data-column');
                column.addClass('column');
                row.append(column);
            }
            $('body').prepend(row);
        }
    }
};
4

2 回答 2

1

如果你在做一个游戏，每一行都可以有自己的逻辑和行为，那么操作数组和DOM结构会更快。如果您的逻辑更复杂，您将看到性能上的差异。因此，如果您确实需要在那里更新对象，请调用 DOM 结构。例如：

function SuperTable(){
    this.tablerows = [];
    this.DOMObject = $("body");
}

SuperTable.prototype.AddRow = function() {
    this.tablerows[this.tablerows.length] = new SuperRow(this.tablerows.length,this.DOMObject);
}

SuperTable.prototype.RemoveRow = function(rowIndex) {
    this.tablerows[rowIndex].DOMObject.remove(); // remove element from DOM
    this.tablerows.splice(rowIndex,1); // remove element from logic of the game
}

function SuperRow(rownumber,parent) {
    this.DOMObject = $("<div>");
    this.DOMObject.addClass('data-row');
    parent.prepend(this.DOMObject);
}

mytable = new SuperTable()
mytable.AddRow() // create row on 0 position
mytable.RemoveRow(0) // remove row from 0 position
于 2015-06-26T13:12:20.210 回答
0

您可以使用JQuery 的.remove()功能。例如，如果要删除最后一行：$("#data-row7").remove()

于 2015-06-26T12:17:49.667 回答