簡體   English   中英

將表格HTML字符串轉換為JSON

[英]Convert a table HTML String to JSON

我正在使用此表到JSON庫,該庫將HTML表從其ID(在此示例中為#testtable )解析為JSON:

var table = $('#testtable').tableToJSON();
alert(JSON.stringify(table));

但是我想從字符串中解析表。 像這樣:

var table = $('<table id="example-table"> <thead> <tr> <th>First Name</th> <th>Last Name</th> <th data-override="Score">Points</th></tr> </thead> <tbody> <tr> <td>Jill</td> <td>Smith</td> <td data-override="disqualified">50</td></tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94</td></tr> <tr> <td>John</td> <td>Doe</td> <td>80</td></tr> <tr> <td>Adam</td> <td>Johnson</td> <td>67</td></tr> </tbody> </table>').tableToJSON();

我該怎么辦?

似乎插件希望該表既在DOM中又在可見中(我在隱藏容器中嘗試過)。

您可以創建一個屏幕外容器以附加到該容器,然后運行插件:

<div id="hidden-div" style="position:absolute; top:-999em; left:-999em"></div>

JS

$(function() {
  var $table = $('<table id="example-table"> <thead> <tr> <th>First Name</th> <th>Last Name</th> <th data-override="Score">Points</th></tr> </thead> <tbody> <tr> <td>Jill</td> <td>Smith</td> <td data-override="disqualified">50</td></tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94</td></tr> <tr> <td>John</td> <td>Doe</td> <td>80</td></tr> <tr> <td>Adam</td> <td>Johnson</td> <td>67</td></tr> </tbody> </table>')
  $('#hidden-div').append($table);
  var table = $table.tableToJSON();
  console.log(table);
});

然后刪除屏幕外元素:

$('#hidden-div').remove()

演示

該插件可以選擇ignoreHiddenRows 只需將其設置為false即可:

var table = $('<table>...</table>').tableToJSON({ignoreHiddenRows: false});

演示:

 var table = $('<table id="example-table"> <thead> <tr> <th>First Name</th> <th>Last Name</th> <th data-override="Score">Points</th></tr> </thead> <tbody> <tr> <td>Jill</td> <td>Smith</td> <td data-override="disqualified">50</td></tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94</td></tr> <tr> <td>John</td> <td>Doe</td> <td>80</td></tr> <tr> <td>Adam</td> <td>Johnson</td> <td>67</td></tr> </tbody> </table>').tableToJSON({ignoreHiddenRows: false}); alert(JSON.stringify(table)); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="https://cdn.rawgit.com/lightswitch05/table-to-json/master/src/jquery.tabletojson.js"></script> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM