Jquery的如何构建动态HTML

我想要动态地创建5个TR内对于每个具有3个TDS与一个循环，请注意：内部的每个我正在填充其具有从阵列Jquery的如何构建动态HTML

<tr> 
<td><td><td> 
</tr> 

<tr> 
<td><td><td> 
</tr> 

<tr> 
<td><td><td> 
</tr> 

<tr> 
<td><td><td> 
</tr> 

<tr> 
<td><td><td> 
</tr>

填充动态值动态HTML 应该是什么样的TD内

$('#output').append(

       + '<td>' 
       + '<ul class="listing" style="margin:0 8px 0 0;width:220px;">' 
       + '<li class="item">' 
       + '<dl>' 
       + '<dt><a href="' + pathname + value.SLink + '" >' + value.CName.replace("(Or Similar)", "") + '</a>' + '</dt>' 
       + '<dd>fr £' + parseFloat(value.CPrice).toFixed(0) + '</dd>' 
       + '<dd class="last">' + value.CType + ', ' + value.CSize + '<br>' 
       + ' Ad: ' + value.Ad 
       + ', Chi: ' + value.Chi + '<br>' 
       + ' Lu: ' + value.Big + ' Big, ' 
       + value.Lu + ' Small'     
       + '</dd>' 
       + '</dl>' 
       + '</li>' 
       + '</ul>' 
       + '</td>' 

        );

来源

2011-11-22 Ali Hasan

我没有看到4 DIV的对TD的含量中..？ –

简单的嵌套循环：

var content; 
for (var i = 1; i<= 5; $i++){ 
    content += '<tr>'; 

    for (var j = 1; j<= 3; j++){ 
     content+= '<td><ul class="listing" style="margin:0 8px 0 0;width:220px;">' 
      + '<li class="item">' 
      + '<dl>' 
      + '<dt><a href="' + pathname + value.SLink + '" >' + value.CName.replace("(Or Similar)", "") + '</a>' + '</dt>' 
      + '<dd>fr £' + parseFloat(value.CPrice).toFixed(0) + '</dd>' 
      + '<dd class="last">' + value.CType + ', ' + value.CSize + '<br>' 
      + ' Ad: ' + value.Ad 
      + ', Chi: ' + value.Chi + '<br>' 
      + ' Lu: ' + value.Big + ' Big, ' 
      + value.Lu + ' Small'     
      + '</dd>' 
      + '</dl>' 
      + '</li>' 
      + '</ul>' 
      + '</td>'; 
    } 
    content += '</tr>'; 
} 
$("body").append(content);

来源

2011-11-22 12:37:22

这是行不通的。 jQuery将在创建后自动关闭你的第一个，并将所有的直接添加到主体 – Ivan

$（“body”）。append（''）; 如何在td标签内添加动态div，如div –

@ Al25串联。 '''+ dynamicDiv +''' –

function consTrTd (elementId, trCount, tdCount){ 
    for(var i = 0; i < trCount; i++){ 

    var ttr = $("<tr>").appendTo("#"+elementId); 
     for(var j = 0; j < tdCount; j++) 
      ttr.append("<td>"); 
    } 
} 

consTrTd(1,5,3);

来源

2011-11-22 12:43:01 erimerturk

$(document).ready(function(){ 
    table = $('<table>'); 
    for (var i =0; i<5; i++){ 
     var tr = $('<tr>'); 
     for (var j =0; j<3;j++){ 
     var td = $('<td>'); 
     $(td).append('<span>All your html code for TD goes here</span>'); 
     $(td).appendTo(tr); 
     } 
     $(tr).appendTo(table); 
    } 
    $(table).appendTo('body'); 
});

jsFiddle

来源

2011-11-22 12:50:57 Ivan

Jquery的如何构建动态HTML

回答

相关问题