如何在javascript中使用for循环来添加HTML [英] How can i use a for loop in javascript to add HTML
本文介绍了如何在javascript中使用for循环来添加HTML的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在我的网站上制作了一个小图库,它包含很多图片,如何在我的网站中使用for循环添加 li
。
I'm making a little gallery in my website and it contains lots of pictures, how can I use a for loop to add the li
in my website.
这是我的HTML,而不是所有那些< li>
我想要 for
循环。
HTML:
This is my HTML right now and instead of all those <li>
I would like a for
loop.
HTML:
<div id="pictureBlock">
<div id="three-columns" class="grid-container">
<ul class="rig columns-3">
<li><img src="images/1.jpg" /></li>
<li><img src="images/2.jpg" /></li>
<li><img src="images/3.jpg" /></li>
<li><img src="images/4.jpg" /></li>
<li><img src="images/5.jpg" /></li>
<li><img src="images/6.jpg" /></li>
<li><img src="images/7.jpg" /></li>
<li><img src="images/8.jpg" /></li>
<li><img src="images/9.jpg" /></li>
<li><img src="images/10.jpg" /></li>
<li><img src="images/11.jpg" /></li>
<li><img src="images/12.jpg" /></li>
<li><img src="images/13.jpg" /></li>
<li><img src="images/14.jpg" /></li>
<li><img src="images/15.jpg" /></li>
</ul>
</div>
</div>
推荐答案
使用jQuery:
var ul = $('ul.rig');
var count = 15; // number of images
for(var i = 1; i <= count; i++) {
ul.append('<li><img src="images/' + i + '.jpg"></li>');
}
这篇关于如何在javascript中使用for循环来添加HTML的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文