如题:我创建了个保存img对象的数组,打算让数组的图像插入一个div元素
为何在浏览器上显示的是
[object HTMLImageElement]而无法显示图片?
javascript
var imgs=[]; for(var i=0;i<36;i++) { var img=new Image(); img.src="image/"+ i.toString()+".jpg"; imgs.push(img); } function PMap(){ this.R=0; this.C=[]; this.show=function(){ this.R=Math.floor(Math.random()*36); this.C[0]=this.R; this._Pmap1.innerHTML=imgs[this.R]; } }
可以把 .innerHTML=img[this.R]
改成 .appendChild(imgs[this.R])
,或者 .innerHTML=imgs[this.R].outerHTML
PS: 给 innerHTML
赋的值是一个 String,而 imgs[this.R]
是一个 Node Object,因此它会自动转成 string(即 [object HTMLImageElement])。但是转成的是 [object HTMLImageElement]
而不是类似 <img src="">
,前者,innerHTML 会把它当成普通的 Text String。
所以,要么把 imgs[this.R]
转成一个 HTML Element String,即 imgs[this.R].outerHTML
,要么用 Node.appenChild()
方法直接插入一个 Node Object(imgs[this.R]
)。
innerHTML插入的是普通的文本,会去掉html标记;你可以改为outerHTML试试