使用JS操作HTML，创建N个层
<!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=gb2312" /><style type="text/css">html,body{ margin: 0px; padding: 0px; text-align: center; font-size: 12px; background-color: White; color: Black; height: 100%; }html,body div{ border: 0px; margin-left: auto; margin-right: auto; background-color: White; color: Black; }html,body img{ border: 0px; }html,body ul{ float: left; margin: 0px; padding: 0px; list-style: none; }* a{ text-decoration: none; }#main{ width:800px; overflow:auto; border:1px dotted #CC00FF;}.title{ width:800px; height:30px; line-height:30px; background-color:#FFFFCC;}.content{width:800px; height:30px; line-height:30px; background-color:#0066CC; border-top:1px dotted Red; border-bottom:1px dotted Red; margin-top:3px;}.clear{ clear:both;}.div1{ float:left; width:300px; height:30px; display:block; display:inline; background-color:#CCCCCC; text-align:left; }.div2{float:left; width:500px; height:30px; display:block; display:inline; background-color: #FFCC99; text-align:left;}</style><script type="text/javascript">var div1;var div2;var div1Str="div1";var div2Str="div2";var content;var contStr="content";var count;function createList(){//alert("setup 1");count=document.getElementsByTagName("div");//alert("setup 2");content=document.createElement("div");//alert("setup 3");content.id=contStr+count.length+1;//alert("setup4"+content.id);content.className="content";//alert("setup 5");document.body.appendChild(content);//alert("setup 6");div1=document.createElement("div");//alert("setup 7");div2=document.createElement("div");//alert("setup 8"+count.length);div1.id=div1Str+count.length+1;//alert("setup 9");div2.id=div2Str+count.length+1;//alert("setup 10");div1.className="div1";//alert("setup 11");div2.className="div2";//alert("setup 12");//alert(content.id);//alert(div1.id);div1.innerHTML='该层ID'+div1.id;div2.innerHTML='该层ID'+div2.id;document.getElementById(content.id).appendChild(div1);document.getElementById(content.id).appendChild(div2);}</script><title>testing</title></head><body><div id="main"><div class="title"><a href="#" >创建新的层</a> </div> <div class="clear"></div></div></body></html>
页:
[1]