jQuery 文档操作 - appendTo() 方法---动态加HTML 元素

定义和用法

appendTo() 方法在被选元素的结尾（仍然在内部）插入指定内容。

提示：append() 和 appendTo() 方法执行的任务相同。不同之处在于：内容和选择器的位置，以及 append() 能够使用函数来附加内容。

语法

$(content).appendTo(selector)

参数	描述
content	必需。规定要插入的内容（可包含 HTML 标签）。
selector	必需。规定把内容追加到哪个元素上。

例子：

function create_list(num,pagenum){

    if(num<1) num=1;
	for(var i=0;i<num;i+=1){
	    var div_id = "div"+i;
		var div = $("<div id='"+div_id+"'></div>");	
	    var headdiv_id = "headdiv"+i;	
        var title1_id = "title1"+i;
        var ny1_id= "ny1"+i;
        var ny2_id= "ny2"+i;

      var headdiv = $("<div id='"+headdiv_id+"'>"+
        '<table  width="99%" border="0" align="center" cellpadding="0" cellspacing="0" class="table_lineheight">'+
        	"<tr>"+
       			 '<th colspan='5' align='center'><span id='"+title1_id+"' class='report_title'></span></th>'+
        	"</tr>"+
        	"<tr>"+
       			"<td id='"+ny1_id+"' width='16%' align='right'> </td><td id='"+ny2_id+"' width='16%' align='left'> </td>"+
        		'<td width="30%" align="right"> </td><td width="23%" align="left">金额单位：元</td>'+
        	"</tr>"+
        "</table>"+
        '</div>');    
        div.appendTo($("#print"));	 
	    headdiv.appendTo($("#"+div_id));

	    var bodydiv_id = "bodydiv"+i;
	    var tbody_id = "tbody"+i;
var bodydiv = $("<div id='"+bodydiv_id+"'>"+
	    '<table width="99%" border="0" align="center" cellpadding="0" cellspacing="0" class="table_list_report margin10">'+
            '<tr>'+
                 '<th width="8%">序号</th><th width="29%">单位名称</th><th width="8%">结算人次</th>'+
                 '<th width="15%">结算金额</th><th width="40%">备注</th>'+
            '</tr>'+
		 	"<tbody id='"+tbody_id+"'></tbody>"+
         "</table>"+
         "</div>");
	    bodydiv.appendTo($("#"+div_id));	    
	    
	    var footdiv_id = "footdiv"+i;
	    var rq_id = "rq"+i;
	    var zbdw_id = "zbdw"+i;
	    var footdiv = $("<div id='"+footdiv_id+"'>"+	    
        '<table width="100%" border="0" cellspacing="0" cellpadding="0" height="30">'+
        '<tr>'+
        	'<td align="center">制表：</td> ' +
         	'<td>  </td> '+
       		' <td align="center">审批：</td>'+
      		'<td>   </td>'+
            '<td align="center">财务：</td>'+
            '<td>   </td>'+
        ' </tr>'+
        '</table>'+
        
      	'<table width="100%" height="30" border="0" cellpadding="0" cellspacing="0">'+
            '<tr>'
                '<td height="30" align="center" valign="bottom">'
                    '<table width="99%" border="0" align="center" cellpadding="0" cellspacing="0" class="table_lineheight">'+   
                    "<tr>"+
                        "<td width='8%' align='right'>制表单位：</td>"+
                        "<td id='"+zbdw_id+"' width='20%' align='left'></td>"+
                        '<td width="14%" align="left">'+
                            '第<font tdata="pageNO" color="blue">'+pagenum+'</font>页/总'+
                            '<font tdata="pageCount" color="blue">'+Math.ceil(num)+'</font>页'+
                        '</td>'+
                        "<td width='7%' align='right'>制表日期：</td>"+
                        "<td id='"+rq_id+"' width='12%' align='left'></td>"+
                    "</tr>"+
                    "</table>"+
                "</td>"+
            "</tr>"+
        "</table>"+
        
        "</div><br/>");
	    footdiv.appendTo($("#"+div_id)); 	  

	    var changediv = $('<div style="page-break-after: always"></div>');
	    if(pagenum!=Math.ceil(num))
	        changediv.appendTo($("#print")); 	  
	    pagenum+=1;   
		document.getElementById("rq"+i).innerHTML =sysdate1.substr(0,4)+"-"+sysdate1.substr(4,2)+"-"+sysdate1.substr(6,2);	     
	}
}