使用tritium转换html中的表

Ale*_*one 3 html-table transform moovweb tritium

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

<body>
  <table>
    <tbody>
      <tr>
        <td>
          ...
        </td>
      <tr>
     </tbody>
  </table>
</body>
Run Code Online (Sandbox Code Playgroud)

小智 6

在我看过的许多项目中,我看到过这个功能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()
  }
}
Run Code Online (Sandbox Code Playgroud)

它确实做了三件事:

  1. 将所有表和表元素更改为div
  2. 为每个前表元素提供一个mw_was_具有前一个元素的类
  3. 根据索引,为每个元素指定一个唯一的id data-mw-id.

通过这三种方法,您可以摆脱桌面,同时保留其元素的多样性.这样,即使在您对其进行转换后,它仍然可以在XPath和CSS中轻松选择.