在JavaScript中创建动态表

时间:2014-07-09 20:23:45

标签: javascript html dom

我正在尝试使用JavaScript创建动态表。我需要表格采用调度程序的形式(24小时的小时块)它必须跨越整个24列的小时,每个块都有一个标题。上午12点,凌晨1点,晚上11点等。但是,我目前仅限于标题的第一个col。我对JavaScript的了解是初学者的。这是我需要和破坏的基本表现。修复此代码或实现更好的方法的最佳方法是什么?

function populateTable(table, time, rows, cells, content) {
            if (!table) table = document.createElement('table');
                var head = document.createElement('thead');
                var title = document.createElement('th');

                head.appendChild(title);
                    for (var x = 1; x <= time; x++){
                    table.appendChild(head);
                    title.appendChild(document.createTextNode(x));
                    }
                var body = document.createElement('tbody');
                    for (var i = 0; i < rows; ++i) {
                        var row = document.createElement('tr');
                            for (var j = 0; j < cells; ++j) {
                            row.appendChild(document.createElement('td'));
                            row.cells[j].appendChild(document.createTextNode(content + (j + 1)));
                            }
                        table.appendChild(row);
                    }
                return table;
                }
                $(document).ready(function () {
                    document.getElementById('scheduleTable')
                    .appendChild(populateTable(null,12,12, 12, "content"));
        });

1 个答案:

答案 0 :(得分:1)

需要将顶部更改为:

var head = document.createElement('thead');
table.appendChild(head);

for (var x = 1; x <= time; x++) {
    var title = document.createElement('th');
    title.appendChild(document.createTextNode(x));
    head.appendChild(title);
}

如果您希望标题单元格正确展开。