javascript点击图片for循环,js用for循环实现照片墙

gpt886

于 2023-11-15 10:47:08 发布

阅读量223

点赞数

文章标签： python 开发语言 AI写作

本文链接：https://blog.csdn.net/2301_79533350/article/details/134415047

版权

本篇文章给大家谈谈javascript点击图片for循环，以及js用for循环实现照片墙，希望对各位有所帮助，不要忘了收藏本站喔。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>html使用java循环显示图片</title>
		<style type="text/css">
			#imgbox img{
				width: 640px;
			}
		</style>
	</head>
	<body>
		<section>
			<div id="imgbox"></div>
		</section>
	</body>
	< type="text/java">
        var html="";
        var imgdata=[
	        {id:1,url:"img/01.gif"},
	        {id:2,url:"img/02.gif"},
	        {id:3,url:"img/03.gif"},
	        {id:4,url:"img/04.gif"},
	        {id:5,url:"img/05.gif"},
	        {id:6,url:"img/06.gif"},
	        {id:7,url:"img/07.jpg"},
	        {id:8,url:"img/08.jpg"},
	        {id:9,url:"img/09.jpg"},
	        {id:10,url:"img/10.jpg"},
	        {id:11,url:"img/11.jpg"},
	        {id:12,url:"img/12.jpg"}
        ];
        for(var i=0,len=imgdata.length;i<len;i++)
        {
            html+='<img src="'+imgdata[i]['url']+'"/>';
        }
        document.getElementById("imgbox").innerHTML=html;
	</>
</html>