Question

怎么使用javascript动态生成嵌套的div

想实现这个样子
<div class="grid_3">
<div style="border:#e5eaff 1px solid;height:40px">
<div>数据</div>
</div>
</div>
<div class="grid_9">
<div style="border:#e5eaff 1px solid;height:40px">
<div>数据</div>
</div>
</div>
页面里有<span id="repostdiv"></span>标记

想实现---通过链接跳到页面时能够动态加载出div列表
想用javascript写的，代码如下，执行不了
var creatediv3=document.createElement("div");
creatediv3.setAttribute("class","grid_3");

var namediv=document.createElement("div");
namediv.style.border="#e5eaff 1px solid";
namediv.style.height="40px";

var creatediv9=document.createElement("div");
creatediv9.setAttribute("class","grid_9");

var contentdiv=document.createElement("div");
contentdiv.style.border="#e5eaff 1px solid";
contentdiv.style.height="40px";

window.onload=function(){
var rediv=document.getElementById("repostdiv");
rediv.appendChild(creatediv3);
rediv.appendChild(creatediv9);
var creatediv3=document.getElementById("creatediv3");
creatediv3.appendChild(namediv);
var creatediv9=document.getElementById("creatediv9");
creatediv9.appendChild(contentdiv);
}

或者用innerHTML
会添加一个div但是添加的div里面在嵌套一个怎么加？
求大神帮助 或者其他方法请说明 本人新手望详解
再问下怎么在添加的div里加东西 比如加<img>或<a> 谢谢

Answer 1

span是行内元素，DIV是块级元素，你这么的是加不进去的。<div id="repostdiv"></div>根元素改成这样

然后就是直接innerHTML进去就行。

var html = [];
html.push('<div class="grid_3">');
html.push('<div style="border:#e5eaff 1px solid;height:40px">');
html.push('<div>数据</div>');
html.push('</div></div>');
html.push('<div class="grid_9"><div style="border:#e5eaff 1px solid;height:40px"><div>数据</div></div></div>'');

document.getElementById('repostdiv').innerHTML = html.join('');

这样就能插进去了。插任何元素都可以这样插的