如何解析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中使用正则表达式将其解析为像<table> </table>这样的HTML格式

Answer 1

• Find
  • Find each
  • If该行将其存储为表属性
  • 如果该行的开头有< header

>D9，则呈现标题行

• 获取并呈现每个表属性

​

- Otherwise, it's a normal row  
    - Get and render each cell

​

​

• 渲染表:将所有片段放在一起，并返回

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>";