테이블을 어떻게 동적으로 만들 수 있습니까?

Question

나는 다음과 같은 XML을 가지고

<root> 
    <object a1="0" b1="2" c1="12/01" a2="0" b2="2" c2="12/03" a3="0" b3="2" c3="12/06"/> 
    <object a1="0" b1="2" c1="12/01" a2="0" b2="2" c2="12/03" /> 
    <object /> 
</root> 

나는 각 개체에 대한 테이블을 작성해야합니다. object[0]에 대한 같은

:

---------------------------- 
a1 value | b1 value | c1 value| 
---------------------------- 
a2 value | b2 value | c2 value| 
---------------------------- 
a3 value | b3 value | c3 value| 
---------------------------- 

및 object[1]에 대한

:

---------------------------- 
a1 value | b1 value | c1 value| 
---------------------------- 
a2 value | b2 value | c2 value| 
---------------------------- 

하지만 각 속성이 다른 이름을 가지고 있기 때문에이 루프를 수행하는 XSLT를 사용하는 방법을 모르겠어요. 도와 주시겠습니까? 아니면 해결 방법을 보여 주시겠습니까? 속성을 파싱하려면 JavaScript를 사용해야합니까?

예상 HTML :

이

<table> 
<tr> 
    <td>a1 value</td> 
    <td>b1 value</td> 
    <td>c1 value</td> 
</tr> 
<tr> 
    <td>a2 value</td> 
    <td>b2 value</td> 
    <td>c2 value</td> 
</tr> 
<tr> 
    <td>a3 value</td> 
    <td>b3 value</td> 
    <td>c3 value</td> 
</tr> 
</table> 

행 수는 객체의 속성의 수에 따라 달라집니다. 여기

Answer 1

는 jQuery를

그것은 첫 번째 속성 a은 행의 값이있는 경우 다른 모든 속성이 또한 행

존재 것이라는 것을 가정한다

var attrs = ['a', 'b', 'c']; var html = ''; $(xml).find('object').each(function (i) { var ctr = 1, $obj = $(this); html += '<h3>Table #' + (i + 1) + '</h3><table>'; do { html += '<tr>'; $.each(attrs, function (_, letter) { html += '<td>' + $obj.attr(letter + ctr) + '</td>'; }); ctr = $obj.attr('a' + (ctr + 1)) !== undefined ? ctr +1 : -1; html += '</tr>'; } while (ctr > 0); html += '</table>'; }); $('body').append(html) 

를 사용하여 작업 예제 DEMO