在 Java Servlet 中访问 JavaScript 表 DOM答案

【问题标题】：Accessing the JavaScript Table DOM in a Java Servlet在 Java Servlet 中访问 JavaScript 表 DOM
【发布时间】：2010-11-08 12:13:55
【问题描述】：

我想编写可重用的代码，该代码从 JSP 获取 HTML 表并将其转换为 Excel 格式以导出给用户。我想利用 HTML DOM 表对象而不是在 Java 中解析 HTML 来提取相同的信息。这样做的最大好处是检查每个单元格中的复选框、按钮等，以便在将单元格写入 Excel 之前将其删除。在我看来，设置会是这样的：

HTML 表格：

<a href="javascript: export();">Export to Excel</a>
<table id="exportTable">
  ...
</table>

JavaScript：

function export() {
  var table = document.getElementById("exportTable");
  // Send table object to Servlet somehow
}

JavaScript 将包含在某种 common.js 中，以便该概念可用于网站任何页面中的任何表格。

** 更新 **

JSP 将使用 Java 对象来生成表格，但表格本身每次都会有所不同。我正在寻找一个通用的解决方案，我可以获得表格的 DOM 结构，从而利用已经完成的 table.rows 和 table.cells，检查每个单元格以删除我在 Excel 中不需要的标签（例如按钮、复选框等），并将响应类型设置为 excel 并将其写给用户。这更有意义吗？

【问题讨论】：

HTML 表格可以被 Excel 解释。也就是说，您所需要的只是“application/ms-excel”的标记和内容类型
显然您是在 JSP 中生成表格，那么为什么不直接输出您要从中创建表格的数据呢？对于实际的 JavaScript 实现，只需查看 Ajax 功能和 jQuery 的 Dom 操作 (jquery.com)
我不明白，这里有问题吗？

标签： javascript java html dom html-table

【解决方案1】：

我会将单元格中的数据序列化为一个简单的 JSON 对象，然后使用 Java 端可用的众多 JSON libraries 之一将其转换回可用的对象。

类似这样的：

function processTable(tableId) {
    var jsonTable = [];
    var tableObj = document.getElementById(tableId);
    if (tableObj) {
        for (var x=0, y=tableObj.rows.length; x < y; x++) {
            var tableRow = tableObj.rows[x];
            var jsonRow = [];
            for (var i=0, j=tableRow.cells.length; i < j; i++) {
                var tableCell = tableRow.cells[i];
                // removes any line feeds or tabs
                jsonRow.push(tableCell.innerHTML.replace(/\t|\n/g, ""));
            }
            jsonTable.push(jsonRow)
        }
    }
    return JSON.stringify(jsonTable);
}

这使用公共域JSON.stringify() 例程，可直接使用here。

您现在可以获取此字符串，将其传递到服务器，然后在 Java 领域重新水合对象。您将获得直接对应于表内容的多维值数组。

注意：这将检索整个表。如果您只想获取表格的主体，则必须修改上述代码以迭代 tBodies，如下所示：

function processTable(tableId) {
    var jsonTable = [];
    var tableObj = document.getElementById(tableId);
    if (tableObj) {
        for (var a=0, b=tableObj.tBodies.length; a < b; a++) {
            var tBody = tableObj.tBodies[a];
            for (var x=0, y=tBody.rows.length; x < y; x++) {
                var tableRow = tableObj.rows[x];
                var jsonRow = [];
                for (var i=0, j=tableRow.cells.length; i < j; i++) {
                    var tableCell = tableRow.cells[i];
                    // removes any line feeds or tabs
                    jsonRow.push(tableCell.innerHTML.replace(/\t|\n/g, ""));
                }
                jsonTable.push(jsonRow)
            }
        }
    }
    return JSON.stringify(jsonTable);
}

【讨论】：

【解决方案2】：

将表发布到服务器。如果你想像在 JavaScript 中一样访问 DOM，你需要Rhino。但我建议坚持使用更容易插入的东西，比如JDOM。然后回显表，将表头中的 content-type 修改为“application/ms-excel”。

【讨论】：