日期:2014-05-16  浏览次数:20413 次

创建div问题

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
.div1{
width:200px;
height:500px;
float:left;
border:1px solid #069;
}
.div2{
width:200px;
height:500px;
float:left;
margin-left:10px;
display:inline;
border:1px solid #9C6;
}
.div2 .d2_1{
width:180px;
height:30px;
float:left;
}
.div2 .d2_1 .d2_1_1{
width:100px;
height:30px;
float:left;
background:#966;
}
.div1 .d2_1{
width:180px;
height:30px;
float:left;
}
.div1 .d2_1 .d2_1_1{
width:100px;
height:30px;
float:left;
background:#966;
}
</style>
</head>

<body>
<div class="div1">
<div class="d2_1">
   <div class="d2_1_1"></div>
   <input type="button" value="删除" />
  </div>
</div>
<div class="div2">
  <div class="d2_1">
   <div class="d2_1_1"></div>
   <input type="button" value="创建" />
  </div>
</div>
</body>
</html>


请问下 当我点击右边创建的时候 怎么才能在左边创建个div出来 就是图片红色框框的那个

------解决方案--------------------
1.
innerHTML("<div>...</div>");
2.
appendChild(document.createElement('div'));