Question

js创建表格时在单元格里放入img对象

var t = document.createElement('table');
var b = document.createElement('tbody');
for ( var i = 1; i <= 5; i++) {
var r = document.createElement('tr');
for ( var j = 1; j <= 6; j++) {
var c = document.createElement('td');
var m = document.createTextNode('<img id=img'+picArr[i][j]+ 'src=' + picArr[i][j] + '>');
c.appendChild(m);
r.appendChild(c);
}
b.appendChild(r);
}
t.appendChild(b);
document.getElementById('map').appendChild(t);
t.setAttribute('border', '1');
我想在每个里面放入img,但是这样不行，createTextNode，只能是文本，
这种方法可以，但是后要删除一列或行，还要添加就不好控制了。
// var data = new Array();
// data.push('<table border=0 cellpadding=0 cellspacing=0><tbody>');
// for ( var i = 1; i <= 5; i++) {
// data.push('<tr>');
// for ( var j = 1; j <= 6; j++) {
// data.push('<td><img src='+picArr[i][j]+'></td>');
// }
// data.push('</tr>');
// }
// data.push('</tbody><table>');
// document.getElementById('map').innerHTML = data.join('');

Answer 1

不知道有没满足你的要求
function deleteTR(tbody, tr) {
tbody.removeChild(tr);
}
function insertTR(tbody) {
var r = document.createElement('tr');
for (var j = 1; j <= 6; j++) {
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 = 1; i <= 5; i++) {
insertTR(b);

}
t.appendChild(b);
document.getElementById('map').appendChild(t);
t.setAttribute('border', '1');

Answer 2

var img = document.createElement("img");
可以创建任何节点。

Answer 3

var m = "<img id='img"+picArr[i][j]+ "' src='" + picArr[i][j] + "'>";

c.innerHTML=m;

Answer 4

你在说什么啊 说清楚点 好不好啊