从旧的 html dom 元素创建 json答案

【问题标题】：creating json from old html dom element从旧的 html dom 元素创建 json
【发布时间】：2011-12-25 11:56:31
【问题描述】：

我正在尝试使用 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 中吗？正则表达式？模板???

【问题讨论】：

我认为你的意思是 scrape 数据，而不是废弃数据。
哈哈哈确实是史蒂文

标签： javascript jquery regex json screen-scraping

【解决方案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 templates，尤其是 {{each}} 标签来呈现项目列表，我发现它们非常易于使用并且非常灵活地呈现 JSON 数据。

【讨论】：

感谢 Steven，这就是我所追求的。