一、问题描述
IE9（包括IE9）以下，不支持通过innerHTML方法为tabel标签内增加dom。
二、问题截图
html代码
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="text.js"></script>
</head>
<body>
<table id="test_table" ></table>
</body>
</html>
js代码
window.onload = function (){
var table_dom = document.getElementById("test_table");
var resArr = [];
resArr.push('<tr>');
resArr.push('<td>1</td>');
resArr.push('<td>2</td>');
resArr.push('<td>3</td>');
resArr.push('</tr>');
table_dom.innerHTML = resArr.join("");
}
谷歌效果----与预期效果一致
IE10 ----与预期效果一致
IE9 ---添加dom失败
table标签的innerHTML问题一、问题描述三、解决方案
三、解决方案
通过appendChild()方法向tabel标签中添加dom。
window.onload = function (){
var table_dom = document.getElementById("test_table");
var trDOM = document.createElement("tr");
var resArr = [];
resArr.push('<td>1</td>');
resArr.push('<td>2</td>');
resArr.push('<td>3</td>');
trDOM.innerHTML = resArr.join("");
//通过appendChild添加dom
table_dom.appendChild(trDOM);
}