'for 루프'를 사용하여 테이블에서 데이터를 추출하는 데 도움이 필요합니다.

Question

누구든지 나를 도울 수 있는지 궁금합니다.

나는 테이블을 만들었고 자바 스크립트를 사용하여 모든 데이터를 추출하여 div에 배치했습니다.

$(function() { 
    $('table').each(function() { 
     var output = "", 
      table = $(this), 
      rowHead = table.find('tbody tr th'), 
      rowSubject = table.find('thead tr th:not(:first-child)'), 
      rowContent = table.find('tbody tr td'), 
      copy = table.clone(); 

     output += '<div class="mobiled-table">'; 
     for (i = 0; i < rowHead.length; i++) { 
      output += '<div class="head">' + $(rowHead[i]).html() + '</div>'; 
      for (j = 0; j < rowSubject.length; j++) { 
       output += '<div class="subject">' + $(rowSubject[j]).html() + '</div>'; 
       output += '<div class="content">' + $(rowContent[i]).html() + '</div>'; 
      } 
     } 
     output += '</div>'; 
     $('table').append(output); 
    }); 
}); 

.content 클래스가 올바르게 작동하지 않는 점을 제외하면 모두 훌륭하게 작동합니다. 나는 내가 틀린 'for loop'를 사용하고 있다고 믿는다. 그렇지 않으면 또 하나의 for loop를 만들어야한다. 내 codepen를 살펴보고 내 문제를 내가 사람을 도울 수있는 희망

http://codepen.io/anon/pen/JrKBf

을 볼하시기 바랍니다.

Answer 1

는 rowContent 때문에 셀들의 행렬을 포함하지만, 하나의 차원 배열로하면 (i * 4) + j이다 rowContent 유효한 인덱스 (I, J) 번역 가지고

rowContent[i] 

의해 대체되어야한다

간단한 방법으로

rowContent[(i*4) + j] 

Answer 2

,이 같이 할 수있는,

var container=$("#container"); 
$("table tr:not(:first)").each(function() { 
    var heading = $(this).find("th").html(); 
    container.append('<div class="subject">' + heading + '</div>'); 
    $(this).find("td").each(function(i) { 
     container.append('<div class="subject">' + $("table th").eq($(this).index()).html() + '</div>'); 
     container.append('<div class="content">' + $(this).html() + '</div>'); 
    }); 
}); 

Fiddle