<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery实现html页面增加删除一个div</title>
<style type="text/css">
.div_css {
border:1px solid #09C;
padding:1px;
margin:1px;
}
.bt_1 {
float:right;
}
.cl {
clear:both;
}
</style>
</head>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
i=1;
$(".bt_1").live("click",function(){ //用live很重要~！！
if($(this).val()=="+"){//可删除的效果，如果不需要可删除这个判断
i++;
$(this).parents("#parent").append(
"<div class=\"div_css\" id=\"div_1\">div"+i+
"<input type=\"button\" class=\"bt_1\" value=\"+\" /><div class=\"cl\"></div></div>"
);
$(this).val("x");//可删除的效果，如果不需要可删除这个赋值
}
else{//可删除的效果，如果不需要可删除这个判断
$(this).parent(".div_css").remove();
}
});
});
</script>
<body>
<div id="parent">
<div class="div_css" id="div_1"> div1
<input name="1" type="button" class="bt_1" value="+" />
<div class="cl"></div>
</div>
</div>
</body>
</html>
