Question

我正在关注Large scale application development and MVP - Part II教程，并在最后一个选择（优化的用户界面 - 哑视图）中说，不应该为每个元素创建一个表元素，而是使用HTML元素创建一个表格，使用TableElement，TableRowElement和TableCellElement创建表。

所以我根据他们的例子创建了代码，但它只是将不同的HTML元素写在彼此之下。我想我的代码会更好地解释它应该做什么。

public void onModuleLoad() {
    HTML html = new HTML();
    html.setHTML(createTable());
    RootPanel.get().add(html);
}

public String createTable() {
    //create table
    TableElement table = Document.get().createTableElement();
    //create tbody
    TableSectionElement tbody = Document.get().createTBodyElement();
    table.appendChild(tbody);

    //Create 10 dummy rows
    for (int i = 0; i < 10; ++i) {
        //insert at -1, which is per definition the last posiion
        TableRowElement row = tbody.insertRow(-1);
        //create 10 dummy columns
        for (int j = 0; j < 10; ++j) {
            //insert at -1, which is per definition the last posiion
            TableCellElement cell = row.insertCell(-1);
            //set a dummy text
            String s = (Integer.toString(i) + " : "
                    + Integer.toString(j));
            cell.setInnerHTML(s);
        }
    }

    return table.getInnerHTML();
}

任何想法都说明为什么它没有创建10x10表？

Answer 1

首先，我建议您使用SafeHtmlBuilder替换该代码，该代码应该更快（根本不需要DOM操作）。

接下来，对于您的问题，您应该将表包装在虚拟容器（例如，DivElement）中，并在该容器上使用getInnerHTML（）。

Answer 2

很简单的错误......我正在返回table.getInnerHTML();，它返回从<tbody>开始并以</toboy>结尾的部分。将其更改为table.toString();修复它！

从TableElement，TableRowElement和TableCellElement创建10x10表

2 个答案: