jQuery가 태그를 자동으로 닫지 않도록 추가하려면 어떻게해야합니까?

Question

약 1000 개의 속성을 가진 JavaScript 개체가 있고이 항목 중 <table>을 만들고 하나의 행에 8 개의 속성 인 <tr>을 만들려고합니다.

jQuery를 사용하고 있습니다. append(); 그러나 자동으로 닫기 </tr> 태그가 추가됩니다. 나는 닫는 </tr>가 어디에 가야하는지 수동으로 정의하고 싶다. 어떻게해야합니까?

목적 :

var g2u = {}; 

g2u.a1 = ""; 
g2u.a2 = ""; 
g2u.a3 = ""; 
g2u.a4 = ""; 
g2u.a5 = ""; 
g2u.a5a = ""; 
g2u.a6 = ""; 
g2u.a6a = ""; 
g2u.a6b = ""; 
... etc... 

<table> :

<table id="list" border="1"> 
</table> 

<script> 
var ctr = 0; 
$("#list").append('<tr>'); 

for (var g in g2u) { 
    $("#list").append('<td><span class="rom">'+g+'</span>\n'); 
    $("#list").append('<span class="eh">'+g2u[g]+'</span>\n'); 
    $("#list").append('<span class="rom">&nbsp;&nbsp;</span></td>\n'); 
    ctr++; 
    if (ctr % 8 == 0) { 
    $("#list").append('</tr><tr>\n'); 
    } 
} 

깨진 출력 :

<tbody><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr></tbody> 
<td><span class="rom">a1</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a2</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a3</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a4</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a5</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a5a</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a6</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a6a</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a6b</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a7</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a8</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a9</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a10</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a11</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a12</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a13</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a14</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><span class="rom">a14a</span></td><span class="eh"></span><span class="rom">&nbsp;&nbsp;</span><td><spa 

Answer 1

에 추가하여 HTML을 구축 할 문자열을 사용할 수 있습니다. DOM에 문자열을 추가하는 것보다 html을 문자열에 넣으십시오.

<script> 
    var ctr = 0; 
    var html='<tr>'; 

    for (var g in g2u) { 
     html+='<td><span class="rom">'+g+'</span>\n'; 
     html+='<span class="eh">'+g2u[g]+'</span>\n'; 
     html+='<span class="rom">&nbsp;&nbsp;</span></td>\n'; 
     ctr++; 
     if (ctr % 8 == 0) { 
     html+='</tr><tr>\n'; 
     } 
    } 


    $("#list").append(html); 

Answer 2

당신은 추가 사용하여, HTML 마크 업의 관점에서 생각하고 당신은 html의 관점에서 생각해야한다 DOM, 태그를 열고 닫는 태그가 없습니다. 당신이 분명히 태그를 닫으려고합니다 추가 할 경우

당신은 다음의 표

var ctr = 0; 
var innerTable = '<tr>'; 

for (var g in g2u) { 
    innerTable += '<td><span class="rom">'+g+'</span>\n'; 
    innerTable += '<span class="eh">'+g2u[g]+'</span>\n'; 
    innerTable += '<span class="rom">&nbsp;&nbsp;</span></td>\n'; 
    ctr++; 
    if (ctr % 8 == 0) { 
    innerTable += '</tr><tr>\n'; 
    } 
} 
$("#list").append(innerTable);