2013-07-21 4 views
0

У меня есть таблица HTML с комбинированными строками td, или, как сказать, я не знаю, как выразить себя (я не так хорош на английском), поэтому я показываю это! Это мой стол:Как преобразовать/преобразовать HTML-таблицу tbody (с rowspans) TO json?

<table border="1"> 
    <thead> 
     <tr> 
      <th>line</th> 
      <th>value1</th> 
      <th>value2</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td rowspan="2">1</td> 
      <td>1.1</td> 
      <td>1.2</td> 
     </tr> 
     <tr> 
      <td>1.3</td> 
      <td>1.4</td> 
     </tr> 
     <tr> 
      <td rowspan="2">2</td> 
      <td>2.1</td> 
      <td>2.2</td> 
     </tr> 
     <tr> 
      <td>2.3</td> 
      <td>2.4</td> 
     </tr> 
    </tbody> 
</table> 

(вы можете проверить его here)

Я хочу, чтобы преобразовать эту таблицу в переменной JSON с помощью JQuery или JavaScript. Как это должно выглядеть, и как мне это сделать? Спасибо, если вы можете мне помочь!

ответ

0

Я верю, что это то, что вы хотите:

var jsonTable = {}; 

// add a new array property named: "columns" 
$('table').find('thead tr').each(function() { 
    jsonTable.columns = $(this).find('th').text(); 
}; 

// now add a new array property which contains your rows: "rows" 
$('table').find('tbody tr').each(function() { 
    var row = {}; 

    // add data by colum names derived from "tbody" 

    for(var i = 0; i < jsonTable.columnsl.length; i++) { 
     row[ col ] = $(this).find('td').eq(i).text(); 
    } 

    // push it all to the results.. 

    jsonTable.rows.push(row); 
}; 

alert(JSON.stringify(jsonTable)); 

Я думаю, что должно быть некоторые поправки, но это не я думаю.

+0

Я получил это исключение: 'Не удалось получить свойство 'push' неопределенной или нулевой ссылки' для этой части:' jsonTable.rows.push (строка); ' – victorio

+0

спасибо за помощь, но есть некоторые проблемы: 1: 'jsonTable.columns = $ (this) .find ('th'). text();' это означает, что он найдет все 'th' и создаст с ними большую строку; 2: 'jsonTable.columnsl.length;' будет большой длиной строки – victorio

+0

вы даже проверили код человека? –

1

если вы хотите конвертировать только текст использовать это:

var array = []; 

$('table').find('thead tr').each(function(){ 
    $(this).children('th').each(function(){ 
     array.push($(this).text()); 
    }) 
}).end().find('tbody tr').each(function(){ 
    $(this).children('td').each(function(){ 
     array.push($(this).text()); 
    }) 
}) 

var json = JSON.stringify(array); 
+0

На самом деле это не представление таблицы. Он просто генерирует одномерный массив всех значений в таблице. См. Http://jsfiddle.net/perqa/4E2L6/ –

1

Чтобы сделать каким-то образом представление вашей таблицы не сделал никаких проблем для меня, но проблема заключается в том, чтобы разобрать его обратно в HTML! Вот JSON с первых 6 тегов:

{"table":{"border":1,"thead":{"th":{"textContent":"line","tr":"textContent":"value1",...}}}}}... 

ИЛИ для лучшего понимания:

{"tag":"table","border":1,"child":{"tag":"thead","child":{"tag":"th","textContent":"line", 
    "child":{"tag":"tr","textContent":"value1","child":...}}}}... 

закрывающие теги включены.

Для получения дополнительных разъяснений мне нужно знать, является ли ваша таблица строкой или частью DOM.

Смежные вопросы