如何使用 thead 和 tbody 创建 FlexTable

How to create a FlexTable with thead and tbody

如何在 GWT FlexTable 中创建这个最简单的 table?

<table>
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>January</td>
      <td>0</td>
    </tr>
    <tr>
      <td>February</td>
      <td></td>
    </tr>
  </tbody>
</table>

FlexTable 的文档并不清楚如何使用 theadtbody 创建 table。有人可以帮忙吗?提前致谢。

这是不可能的。 为什么需要它?

如果想保持FlexTable灵活性,需要增加一个thead元素,可以通过操作TableElement.它非常低级,但 id 可以满足您的需求。

以下是如何获得示例中给出的 DOM 结构:

FlexTable table = new FlexTable();

table.setText(0, 0, "January");
table.setText(0, 1, "0");
table.setText(1, 0, "February");
table.setText(1, 1, "");

com.google.gwt.user.client.Element oldElement = table.getElement();
com.google.gwt.dom.client.Element element = (com.google.gwt.dom.client.Element) oldElement;
TableElement tableElement = (TableElement) element;
TableSectionElement tHead = tableElement.createTHead();

TableRowElement row = tHead.insertRow(0);
row.insertCell(0).setInnerText("Month");
row.insertCell(1).setInnerText("Savings");

RootPanel.get().add(table);

请注意 table.getElement(); returns 已弃用 com.google.gwt.user.client.Element。它扩展了 com.google.gwt.dom.client.ElementTableElement 也是如此。完成所有转换后,您可以将行和单元格添加到 thead.

这是结果(在 Chrome 上使用 GWT 2.7 测试):