我想基于一些计算动态创建div。我可以动态地构建div,但唯一的问题是它没有在fly上使用高度和宽度。请尽可能分享他们的视图或代码。
这是我用来参考的脚本。
<script type="text/javascript" language="javascript">
function createDiv()
{
var totalheight=400;
var totalwidth = 600;
var height = 80;
var width = 40;
var divheight = totalheight / height;
var divwidth = totalwidth / width;
var id=1;
for(var i=1;i<=divheight;i++)
{
var eh=divwidth;
var fh=1;
for (var w = 1; w <= divwidth; w++)
{
var div=document.createElement("<div id='"+id+"' style=\"background:#F0E68C;width:'"+width+"'px;height:'"+height+"'px;border:solid 1px #c0c0c0;padding: 0.5em;text-align: center;float:left;\"></div>");
document.body.appendChild(div);
eh=eh+divheight;
fh=fh+divheight;
id++;
}
var div1=document.createElement("<br/>");
document.body.appendChild(div1);
}
}
</script>
提前致谢。
答案 0 :(得分:3)
试试这个..希望这就是你要做的......
<html>
<script type="text/javascript" >
function newDiv(){
var totalheight=400,ht = 80 , totalwidth = 600 ,wd = 40 ,i;
var divheight = totalheight / ht;
var divwidth = totalwidth / wd;
var id=1;
for(var i=1;i<=divheight;i++)
{
var eh=divwidth;
var fh=1;
for (i = 1; i <= divwidth; i++)
{
var div=document.createElement("div")
div.setAttribute("id","newDivId"+id)
div.setAttribute("class","newDiv")
div.style.width =wd+"px";
div.style.height =ht+"px";
document.body.appendChild(div);
eh=eh+divheight;
fh=fh+divheight;
id++;
}
var div1=document.createElement("<br/>");
document.body.appendChild(div1);
}
}
</script>
<style type="text/css">
.newDiv{
background-color:#F0E68C;
border:1px solid #c0c0c0;
padding: 0.5em;
text-align:center;
float:left;
}
</style>
<body>
<input type="button" onclick="newDiv()" value="Click Me">
</body>
</html>
答案 1 :(得分:0)
看起来你没有向div中添加任何内容,所以你不会看到任何东西,除非你有一些像边框这样的视觉样式在屏幕上看到它。
这里有几点需要注意
px
,em
等。<强> Demo 强>