배열 배열 내에서 테이블 데이터 저장소 찾기

Question

테이블에서 데이터를 가져와 배열에 저장해야합니다. 테이블의 각 행은 배열 내의 새로운 배열이어야합니다. 기본적으로 HTML은 다음과 같습니다 요법

<table id="contactlisttable"> 
    <tr> 
     <th>Name</th> 
     <th>Title</th> 
     <th>Phone</th> 
    </tr> 
    <tr> 
     <td class="contactlist contactlistlastfirst">Joey</td> 
     <td class="contactlist contactlisttitle">webdesigner</td> 
     <td class="contactlist contactlistphone">5555555</td> 
    </tr> 
    <tr> 
     <td class="contactlist contactlistlastfirst">Anthony</td> 
     <td class="contactlist contactlisttitle">webdesigner</td> 
     <td class="contactlist contactlistphone">5555555</td> 
    </tr> 
</table> 

... 여기

내 코드

jQuery(document).ready(function(){ 
    $(function(){ 
     var $table = $("#contactlisttable"), 
     $headerCells = $table.find("tr th"), 
     $myrows = $table.find("tr"); // Changed this to loop through rows 

     var headers = [], 
      rows = []; 

     $headerCells.each(function() { 
      headers[headers.length] = $(this).text(); 
     }); 

     $myrows.each(function() { 
      $mycells = $myrows.find("td.contactlist"); // loop through cells of each row 
      cells = [] 
      $mycells.each(function() { 
       cells.push($(this).text()); 
      }); 
      if (cells.length > 0) { 
       rows.push(cells); 
      } 
     }); 
     console.log(headers); 
     console.log(rows); 
    }); 
}); 

내 현재 코드 끈다

[["Waddell, Joey", "webdesigner", "", 15 more...], ["Waddell, Joey", "webdesigner", "", 15 more...], 

원하는 출력이 될 것입니다 :

["Name","Title","Phone"] 
[["Joey","webdesigner","555555"] 
["Anthony","webdesigner","555555"]] 

Answer 1

나는이 간단 할 수 있다고 생각 :

Live Demo

JS에게

$(function(){ 
    var results = []; 
    var row = -1; 
    $('#contactlisttable').find('th, td').each(function(i, val){ 
     if(i % 3 === 0){ //New Row? 
      results.push([]); 
      row++;//Increment the row counter 
     } 
     results[row].push(this.textContent || this.innerText); //Add the values (textContent is standard while innerText is not)  
    }); 
    console.log(results); 
}); 

---

편집

을

여기에 더 좋은 해결책이 있습니다 (IE9 + 호환). 그것은 이전의 솔루션과 달리 가변 행 길이를 고려합니다.

Live Demo

JS

//IE9+ compatable solution 
$(function(){ 
    var results = [], row; 
    $('#contactlisttable').find('th, td').each(function(){ 
     if(!this.previousElementSibling){ //New Row? 
      row = []; 
      results.push(row); 
     } 
     row.push(this.textContent || this.innerText); //Add the values (textContent is standard while innerText is not)  
    }); 
    console.log(results); 
});