Преобразование данных таблицы HTML в объект JSON в jQuery

Question

Кто-нибудь знает, как преобразовать таблицу значений HTML в красивый объект JSON, которым можно манипулировать с помощью jQuery?

Answer 1

HTML-таблица? Мол, все содержимое <td> в двумерном массиве?

var tbl = $('table#whatever tr').map(function() {
  return $(this).find('td').map(function() {
    return $(this).html();
  }).get();
}).get();

Затем просто используйте $ .json (или любую другую нужную вам библиотеку), чтобы превратить это в строку JSON.

edit & mdash; переписан для использования нативного ( шим здесь ) .map() из прототипа массива:

var tbl = $('table#whatever tr').get().map(function(row) {
  return $(row).find('td').get().map(function(cell) {
    return $(cell).html();
  });
});

Функция jQuery .map() имеет «особенность» сглаживания возвращаемых массивов в массиве результатов. То есть, если функция обратного вызова возвращает значение, которое само является массивом, то вместо того, чтобы возвращаемый массив стал значением одна ячейка результата .map(), каждый из его элементов добавляется к результату.

Это может работать с использованием исходной версии jQuery и просто оборачивать дополнительный массив вокруг возвращаемых значений.

Answer 2

Вы имеете в виду следующую ситуацию?

Дано:

A1 B1 C1 ...
A2 B2 C2 ...
...

Необходимо:

{"1": ["A1", "B1", "C1", ...], 
 "2": ["A2", "B2", "C2", ...], ...}

Поэтому используйте следующую функцию, которая создает допустимую функцию JSON-String без трейлинга ",":

function html2json() {
   var json = '{';
   var otArr = [];
   var tbl2 = $('#dest_table tr').each(function(i) {        
      x = $(this).children();
      var itArr = [];
      x.each(function() {
         itArr.push('"' + $(this).text() + '"');
      });
      otArr.push('"' + i + '": [' + itArr.join(',') + ']');
   })
   json += otArr.join(",") + '}'

   return json;
}

Answer 3

Мне нужно было то же самое, за исключением возможности игнорировать столбцы, переопределять значения и не путать вложенные таблицы. В итоге я написал таблицу плагинов jQuery для json:

https://github.com/lightswitch05/table-to-json

Все, что вам нужно сделать, это выбрать вашу таблицу с помощью jQuery и вызвать плагин:

var table = $('#example-table').tableToJSON();

Вот демонстрация этого в действии:

http://jsfiddle.net/Crw2C/173/