从旧的 HTML DOM 元素创建 JSON

Question

我正在做一些jQuery+Greasemonkey，试图重新设计一个内部工作网站的界面，因为我每天都需要使用它，所以想让它更易用。

我已经抓取了页面并将其放入一个div中。我可以使用一些jQuery选择器来识别表格中我需要的数据行。

然而，它是旧的冗长HTML代码，例如：

  <tr style="font-family:blaaa">
     <td>1.</td>
     <td><a target="_BLANK" href="url=my bugs">13312800</a></td>
     <td sorttable_customkey="20110512">
       12-MAY-11
     </td>
     <td> Many more tds </td>
 </tr>

我有另一个tr，其中包含我可能在某个阶段想要用作我的json键的信息。

有什么最好的方法可以获取重要数据？我希望最终将其存储在某些JSON中？使用正则表达式？模板？？？

- wmitchell

---

我理解你的意思是“抓取”数据，而不是“废弃”数据。 - Steven de Salas

哈哈哈，确实是的，Steven。 - wmitchell

Answer 1

你需要在这里进行一些递归，并应用每个TR标签的选择器。

var recordset = [];
$('table.myTable tr').each(function(i,e) {
    var record = {
       id: $(e).find('td:nthchild(2) a').text(),
       url: $(e).find('td:nthchild(2) a').attr('href'), 
       date: $(e).find('td:nthchild(3)').text(), 
       comment: $(e).find('td:nthchild(4)').text()
    };
    recordset.push(record);
});

// Here you have complete recorset:
console.log(recordset);

// To output some JSON in a string
for (var i = 0; i < recordset.length; i ++) {
   alert($.param(recordset[i]));
}

如果您想使用特定的DOM输出此数据，请尝试使用jQuery模板，特别是{{each}}标签来呈现项目列表，我发现它们非常易于使用，并且对于呈现JSON数据非常灵活。

- Steven de Salas

---

谢谢Steven，这正是我想要的。 - wmitchell