1. 使用document.getElementById()方法获取到每个div元素，并将其存储在变量中；
2. 使用document.createElement()方法创建一个img元素，并将其存储在变量中；
3. 使用img元素的src属性设置图片的路径；
4. 使用appendChild()方法将img元素添加到每个div元素中。
以上就是在javascript中给三个div添加图片的方法，希望能够帮助您解决问题。
把一串html
标签赋给一个
javascript
变量，除属性的值要用转义的双引号外，某些时候字符串还很长，显得有些复杂。如果用
js
动态添加元素，就不会有那么复杂的字符串出现，代码阅读性强一点，也容易理解。
网页是由
html
标签一层层组成的，js
也可以动态添加一层层的诸如
div、li、img
这样的标签。其实，不管是什么
html
标签，js
动态创建的方法都差不多，接着就先从动态添加
div
开始。
一、js
动态添加元素div
<div
id="parent"></div>
function
addElementDiv(obj)
{
var
parent
=
document.getElementById(obj)
//添加
div
var
div
=
document.createElement("div")
//设置
div
属性，如
id
div.setAttribute("id",
"newDiv")
div.innerHTML
=
"js
动态添加div"
parent.appendChild(div)
}
调用：addElementDiv("parent")
二、js
动态添加li
<ul
id="parentUl"><li>原li</li></ul>
function
addElementLi(obj)
{
var
ul
=
document.getElementById(obj)
//添加
li
var
li
=
document.createElement("li")
//设置
li
属性，如
id
li.setAttribute("id",
"newli")
li.innerHTML
=
"js
动态添加li"
ul.appendChild(li)
}
调用：addElementLi("parentUl")
三、js
动态添加元素img
<ul
id="parentUl"></ul>
function
addElementImg(obj)
{
var
ul
=
document.getElementById(obj)
//添加
li
var
li
=
document.createElement("li")
//添加
img
var
img
=
document.createElement("img")
//设置
img
属性，如
id
img.setAttribute("id",
"newImg")
//设置
img
图片地址
img.src
=
"/images/prod.jpg"
li.appendChild(img)
ul.appendChild(li)
}
调用：addElementImg("parentUl")
以上这篇js
动态添加元素(div、li、img等)及设置属性的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
不知道有没满足你的要求function deleteTR(tbody, tr) {
tbody.removeChild(tr)
}
function insertTR(tbody) {
var r = document.createElement('tr')
for (var j = 1j <= 6j++) {
var c = document.createElement('td')
var m = document.createTextNode('<img id=img' + picArr[i][j] + 'src=' + picArr[i][j] + '>')
var insert = document.createElement('<input type="button" value="新增一行" \>')
insert.onclick = function () {
insertTR(tbody)
}
var deletes = document.createElement('<input type="button" value="删除这行" \>')
deletes.onclick = function () {
deleteTR(tbody, r)
}
c.appendChild(m)
c.appendChild(insert)
c.appendChild(deletes)
r.appendChild(c)
}
tbody.appendChild(r)
}
var t = document.createElement('table')
var b = document.createElement('tbody')
for (var i = 1i <= 5i++) {
insertTR(b)
}
t.appendChild(b)
document.getElementById('map').appendChild(t)
t.setAttribute('border', '1')
