使用氚转换html中的表格答案

【问题标题】：Transforming tables in html using tritium使用氚转换html中的表格
【发布时间】：2013-04-23 18:52:32
【问题描述】：

我正在使用Moovweb SDK，我想将表格及其所有元素转换为 div，以方便移动 Web 开发/样式设置。做这个的最好方式是什么？

<body>
  <table>
    <tbody>
      <tr>
        <td>
          ...
        </td>
      <tr>
     </tbody>
  </table>
</body>

【问题讨论】：

标签： html-table transform moovweb tritium

【解决方案1】：

我在许多项目中看到有一个用于此目的的函数table_dump。我不能把它的发明归功于它，但它是完整的：

@func XMLNode.table_dump(Text %xpath){
  $(%xpath) {
    name("div")
    add_class("mw_was_table")

    $(".//table | .//tr | .//td | .//th | .//thead | .//tfoot | .//tbody | .//col | .//colgroup | .//caption") {
      %i = index()
      %n = name()
      name("div")
      attributes(data-mw-id: concat("mw_dump_", %n, %i), width: "")
      add_class(concat("mw_was_", %n))
    }

    yield()
  }
}

它确实做了三件事：

将所有表格和表格元素更改为 div
为每个前一个表格元素赋予一个类 mw_was_ 及其前一个元素
根据索引，给每个元素一个唯一的 id，如 data-mw-id。

通过所有这三个，您可以摆脱表格，同时保留其元素的多样性。这样，它在 XPath 和 CSS 中仍然可以轻松选择，即使您已经对其进行了转换。

【讨论】：