试图将HTML表保存到JS数组中。我做错了什么?

时间:2017-12-21 22:36:02

标签: javascript html arrays

提前感谢您的时间和精力。我想将我的HTML表格的内容保存到javascript数组中。关于我循环遍历表以尝试提取其内容的方法的任何建议将不胜感激。我将包括我所有相关的代码。

我有一个HTML表格

var table = '';
    var letterArray = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J'];
    var rows = 21;
    var cols = 11;
    var selectedCell;
    var returnedID;
    var tableArray = [];

    for (var r = 0; r < rows; r++)
    {
        table += '<tr>';

        for (var c = 0; c < cols; c++)
        {
            if (c == 0)
            {
                if (r == 0)
                {
                    var cellID = r.toString();
                    cellID += letterArray[c - 1];
                    table += '<td style="min-width:50px; height:25px;">' + '</td>';
                }
                else
                {
                    var cellID = r.toString();
                    cellID += letterArray[c - 1];
                    table += '<td style="min-width:50px; height:25px">' + r + '</td>';
                }

            }
            else if (r == 0 && c > 0)
            {
                var cellID = r.toString();
                cellID += letterArray[c - 1];
                table += '<td style="min-width:50px; height:25px">' + letterArray[c - 1] + '</td>';

            }
            else
            {
                var cellID = r.toString();
                cellID += letterArray[c - 1];
                table += '<td id="' + cellID + '" style="min-width:50px; height:25px;" onclick="selectCell(this)">' + '</td>';
            }

        }

        table += '</tr>';
    }

    //write the table to the document
    document.write('<table id="table" border=1>' + table + '</table>');

然后我有一个选择单元格的函数

function selectCell(x)
    {
        var currentSelection = document.querySelector('.selected');

        if (currentSelection)
        {
            currentSelection.classList.remove('selected');
        }

        x.classList.add('selected');

        var selectedCellID = x.parentNode.rowIndex.toString();
        selectedCellID += String.fromCharCode((x.cellIndex - 1) + 65);

        returnedID = selectedCellID;
    }

然后是一个从文本框输入值到单元格中的函数

function textEnter()
    {
        var input = document.getElementById("txtField").value;
        document.getElementById(returnedID).innerText = input;
        document.getElementById("txtField").value = '';
    }

这是我的问题:我想将此表保存到数组中。这是我的尝试:

function save()
    {
        alert("inside save()");
        var tableData = document.getElementById("table");

        var current, cell;

        for (var i = 0; (current = tableData.rows[i]) ; i++)
        {
            for (var j = 0; (cell = current.cells[j]); j++)
            {
                tableArray.push(cell[j].innerText);
            }
        }

        localStorage.setItem("table", JSON.stringify(tableArray));
    }

最后我有一个函数只是试图通过警告数组的长度来测试我的数组成功或失败

function test()
    {
        alert(tableArray.length.toString());
    }

在我的表中输入som数据并运行我的save()函数,然后用我的test()函数检查它,它返回一个0的数组长度。所以我在从html数据转换到表。任何建议表示赞赏再次感谢您的时间和精力

0 个答案:

没有答案