JS中div的动态添加

新建html文件，body中加入如下代码

    //添加一个500*500的div快
    <div id="aa" style="width:500px;height:500px;background-color:#999;">
		
	</div>
	//添加一个500*500的表格
	<div id="bb" style="width:500px;height:500px;background-color:#888;">
		<table id="tb_1">
			
		</table>
	</div>
	//新建两个button
	
	<input id="btn_1" type="button" value="添加元素">
	<input id="btn_2" type="button" value="获取元素">

在script方法中输入代码

<script type="text/javascript">

var flag = 0;
//当触发id为btn_1时，执行function()
$("#btn_1").bind("click",function(){
	
	var div_child1 = '<div id="div_child_1" style="height:100px;width:100px;background-color:#777;float:left"></div>';
	
	var div_child2 = '<div id="div_child_1" style="height:100px;width:100px;background-color:#999;float:left"></div>';
	
	flag += 1;
	if( (flag % 2) == 1){//当flag为奇数时，添加第一个div
		$("#aa").append(div_child1);
	}
	else{//当flag为偶数时，添加第一个div
		$("#aa").append(div_child2);
	}
});
//当初发id为btn_2时，触发
$("#btn_2").bind("click",function(){
	
	var trs = '<tr> <td>姓名</td><td>性别</td><td>年龄</td><td>学校</td><td>班级</td><td>宿舍</td> </tr>';
	for(var i = 0; i < 10; i++){
		var tr = '';
		tr += '<tr style="width:100%;height:35px;">';
		tr += '<td>aaa</td>';
		tr += '<td>sss</td>';
		tr += '<td>ddd</td>';
		tr += '<td>fff</td>';
		tr += '<td>ggg</td>';
		tr += '<td>hhh</td>';
		tr += '</tr>';
		
		trs += tr;
	}
	//将trs串添加到id为tb_1的表格中去
	$("#tb_1").append(trs);
});

	
</script>

执行实现：