怎样用js插入多张图片

<style type="text/css">
</style>
<script language="javascript">
var i;
var imgs = ['https://lh4.ggpht.com/9c5DhY0f86vBQS8GXMV0QIfKoa6_4_xALcCon0PROkk9KxmgXN6E-9JsHMWRJ9kVXUg=w124',
'https://lh5.ggpht.com/YiDR03Al7VMlPDGDsfbWk9BK1m0sWhPDcpU38wzR53o7ZZEcdEnzJRckkiru0PtS_iw=w124',
'https://lh4.ggpht.com/p63iqR_dLbj9n8MAaPygRB-DGylHXvppBvX3HxABPBukjVOdN18_aPhLRUyllly3utK4=w124'];
var len = imgs.length;
var img = document.getElementById('img');
for(i=0;i<len;i++)
{
img.src = imgs[i];}
</script>
</head>

<body>
<img id="img" src="">
</body>
</html>
如果我有上千个图片的链接,我把这些链接放到一个数组里面,然后依次或随机显示到页面上,就想实现这样的功能,请问代码哪里有误?多谢!

var arrImgs={"url1","url2","url3",...};图片地址存在数组中
var html='';
//遍历数组插入img标签到页面
for(var i=0;i<arrImgs.length;i++){
    html+='<img src="'+arrImgs[i]+'" />';//创建img标签,图片地址赋值src
}
document.getElementById("要插入的容器id").innerHtml=html;

温馨提示:内容为网友见解,仅供参考
第1个回答  推荐于2017-11-25
上千张图片,怎么这么多哦
理论上是可以的
但,你的意思是把这上千个图片链接都放到js数组里对吧?
这样会造成浏览器运行js负担非常重哦
似乎这种方式不是很好,弄不好,卡主浏览器
你还是想点别的招吧
你这想法不利于页面优化本回答被网友采纳
第2个回答  2019-02-26
<!DOCTYPE html>
<html>
    
    <head>
        <meta charset="UTF-8">
        <style >
            img{width: 100px; height: 100px;}
        </style>
        <title></title>
    </head>
    <body>
        
        <div  id="ii" ></div>
    </body>
     
</html>
<script language="javascript">

 
        var arrImgs=["images/jo.jpg","images/jo.jpg"]
        var ww='';
          //遍历数组插入img标签到页面
        for(var i=0;i<arrImgs.length;i++){
        ww+='<img src="'+arrImgs[i]+'"/>';//创建img标签,图片地址赋值src
        
          }
           
     document.getElementById("ii").innerHTML=ww;
</script>

第3个回答  2013-06-15
你这样网页加载完不就显示的是最后那张图片么?

怎样用js插入多张图片
var arrImgs={"url1","url2","url3",...};图片地址存在数组中var html='';\/\/遍历数组插入img标签到页面for(var i=0;i<arrImgs.length;i++){ html+='';\/\/创建img标签,图片地址赋值src}document.getElementById("要插入的容器id").innerHtml=html;...

javascript怎么添加图片(js在图片上添加标记)
最好用插件,去layer官网有专门的点击图片,弹出浏览还支持多个图片。先去官网下载layer包,你的网页引用layer的js文件。这个实现一般有两用方式用js定义一个字符串变量,把图片的字符串写进去,然后div.innerhtml把这个字符串加进去。用类似jquery的js插件,也是先定义图片字符串变量,然后div.append这个字符...

如何在同一个div中插入多张照片,每次只显示一张,每隔一段时间显示不同...
1、最外层div,设置好长度宽度,并css设置overflow:隐藏;2、内层div(宽度高度和外层的一样),并在内层div里,通过标签实现,图片从左至右一行排列(float:left设置);3、js(set timeinterval,实现间隔时间),并且实现内层div的左边距以此增加(图片的宽度),如果左边距到达n-1张图片的宽度时,...

用js对html里面的图片进行交互(用js对html里面的图片进行交互操作)_百度...
3、bootstrap也提供轮播模板。自己写的话,假如放3张轮播图,pic1,pic2,pic3。创建一个ul,ul中放5张图片,顺序是pic3,pic1,pic2,pic3,pic1,这样衔接起来。4、静态获取图片写法,给定图片的个数,用js实现轮播图自动转换。5、之所用js添加小圆点,是因为小圆点的数量是由图片张数决定的。

src怎么放多张照片
src放多张照片的解决方法是。1、运用c语言编写一个可以读取图片路径的exe程序,此程序能生成一个保存着图片名的xml文件,此文件的xml文件路径固定。2、在每次改变图片内容后,运行一下这个程序,更新xml文件。3、构造一个js函数,读取xml文件后,自动构造元素标签,并插入到html文件中就可以方多张照片了...

想在一个div里面添加图片,用js怎么写啊?
1、新建一个HTML文件,保存为test.html,用于编写代码实现拖放功能 。2、在test.html添加一个div标签,并且给它一个id,用于下面编写样式。3、通过div的id , 给div定义CSS样式,例如,把div定义为一个带边框的长方形。下面将实现将图片拖放在这个长方形中。4、在div的下面定义一张被拖放图片,并设置...

bootstrap carousel插件,原来默认是3张图片的,我现在想添加多张图
[这里是要添加的,最后的data-slide-to="3",是从0开始的 你需要的是四个,那排列下来就是0-1-2-3]

如何用JS写入地址?比如一个图片
function changeImg(){ i++;if(i>7){ i=1;} document.getElementById("myPic").src= "..\/img\/"+ i + ".jpg";setTimeout("changeImg()",2500);} 注意:此处是定时切换图片,设置的一共有7张,切换时,需在html段中将第一张加载进去,如: ...

...在这图片里的5个方块中加入滚动的多张图片?希望能详细点,详细在加...
如果想要加入滚动图片的话,需要js实现,目前有很多JQuery图片轮播插件可以用,思路就是在每个div上加一个相对定位和设置overflow: hidden;之后吧图片设置为绝对定位,再使用js改变每个图片的位置,例如:水平移动的话,图片的left(css属性)值减少或增加,就可实现轮播功能 ...

在dreamweaver中如何设置多张图片 当鼠标点击一下它就跟换一张图片...
简单的代码如下 加在body里 需要外加div的再追问 function fn(n){ var nextn;if(n==3){nextn=1;} else{nextn=n+1;} document.getElementById("img"+n).style.display="none";document.getElementById("img"+nextn).style.display="block";} ...

相似回答