如何使用javaScript动态显示多个div? [英] how to display multiple divs dynamically using javaScript?

查看:94
本文介绍了如何使用javaScript动态显示多个div?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

你好,我是网络编程的新手,并要求使用javaScript动态显示多个div

这是我正在尝试的代码,但没有显示输出:



hello,I am new to web programming and asked to show multiple divs dynamically using javaScript
this is the code i am trying but no output is showing:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>Untitled Document</title>

<style type="text/css">
.inlineDiv{
    display:inline-block;
    float:left;
}

#holder {
    width:100%;
}
</style>

<script type="text/javascript">

var colors = new Array("ff0000","00ff00","0000ff","ff00ff","beeeef");
var n = 5;

for(var i=0;i<n;i++){
    var div = document.createElement('div');
    div.className = "inlineDiv";
    div.style.backgroundColor = "#" + colors[i];
    div.style.width = ($('#holder').width() / n) + "px";
    div.style.height = "500px";
    document.getElementById('holder').appendChild(div);
}

</script>



</head>

<body>

<div id="holder"></div>
</body>
</html>





请帮我解决我所犯的错误。



Kindly help me out the mistake i have done.

推荐答案

' #holder')。width()/ n)+ px;
div.style.height = 500px;
document .getElementById(' holder').appendChild(div);
}

< / script >



< / head >

< 正文 >

< div id = holder > < / div >
< / body >
< / html >
('#holder').width() / n) + "px"; div.style.height = "500px"; document.getElementById('holder').appendChild(div); } </script> </head> <body> <div id="holder"></div> </body> </html>





请帮我解决我所犯的错误。



Kindly help me out the mistake i have done.


好的问题:

我没有包括

Ok got the problem:
I didn't included the


(document).ready(function(){});
(document).ready(function() {});

function。


这篇关于如何使用javaScript动态显示多个div?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆