如何解析 wikitext 表格 HTML？

Question

解析表格的Wikicode是

{| class="wikitable"
|-
! Header 1
! Header 2
! Header 3
|-
| row 1, cell 1
| row 1, cell 2
| row 1, cell 3
|-
| row 2, cell 1
| row 2, cell 2
| row 2, cell 3
|}

我需要在 file 中使用正则表达式将其解析为 HTML 格式，例如 <table> </table>？

Answer 1

• 查找表
  • 查找每一行
  • 如果该行有= 将其存储为表属性
  • 如果行的开头有!，则呈现标题行
    • 获取并呈现每个标题
  • 否则是正常行
    • 获取并渲染每个单元格
• 渲染表格：将所有部分放在一起，然后返回

https://jsfiddle.net/n1dp3fcs/2/

var attrs = "", headers = "", rows = "";
function renderTables(wiki) {
  wiki.replace(findTable, parseTable);
  var HTML = "<table" + (attrs ? " " + attrs : "") + ">" +
    (headers ? "<thead>" + headers + "</thead>" : "") +
    (rows ? "<tbody>" + rows + "</tbody>" : "") +
  "</table>";
  attrs = headers = rows = "";
  return HTML;
}

var findTable = /\{\|\s*(.*?)\s*\|\}/g,
    parseTable = function(match, content) {
      Array.prototype.forEach.call(content.split(newRow), renderRow);
    };

var newRow = /\s*\|-\s*(?:\|\s*)?/g,
    renderRow = function(content) {
      console.log("tr", content, arguments);
      if (content.indexOf("=") !== -1) { console.log("attrs"); attrs += content; }
      else if (content[0] === "!") { console.log("th"); headers += "<tr>" + content.replace(findHeader, renderHeader) + "</tr>"; }
      else { console.log("td"); rows += "<tr>" + content.replace(findCol, renderCol) + "</tr>"; }
    };

var findHeader = /\s*!\s*([^!]+?)(?=\s*!|$)/g, renderHeader = "<th>$1</th>";

var findCol = /(?:^\s*|\s*\|\s*)([^\|]+?)(?=\s*\||$)/g, renderCol = "<td>$1</td>";