innerHTML的问题
浏览数：38 /
时间：2015年06月09日
目的就是给页面的一个table进行多次赋值。
1)第一版的代码
<table border="1" id="divData" >
<tr>
<th class="bglist-2">
JO
</th>
<th class="bglist-2">
信息
</th>
<th class="bglist-2">
掃描時間
</th>
<th class="bglist-2">
掃描賬號
</th>
</tr>
</table>
for (i = 0; i < json.length; i++) {
strTemp = strTemp + "<tr><td class=‘bglist-1‘>"
+ json[i].JoNo + "</td><td class=‘bglist-1‘>" + json[i].Info
+ "</td><td class=‘bglist-1‘>" + json[i].CreateTime
+ "</td><td class=‘bglist-1‘>" + json[i].Creater + "</td></tr>";
}
var x = document.getElementById("divData");
for (i = x.childNodes.length - 1; i > 1; i--) {
x.removeChild(x.childNodes[i])
}
x.innerHTML = x.innerHTML + strTemp;
在IE10和Chrome下测试OK,User使用IE8，直接JS报错，晕到.
查资料，发现有些人说innerHTML在IE8下面存在一些问题
2)第二版代码
<table border="1" >
<tr>
<th class="bglist-2">
JO
</th>
<th class="bglist-2">
信息
</th>
<th class="bglist-2">
掃描時間
</th>
<th class="bglist-2">
掃描賬號
</th>
</tr>
<div id="divData"></div>
</table>
for (i = 0; i < json.length; i++) {
strTemp = strTemp + "<tr><td class=‘bglist-1‘>"
+ json[i].JoNo + "</td><td class=‘bglist-1‘>" + json[i].Info
+ "</td><td class=‘bglist-1‘>" + json[i].CreateTime
+ "</td><td class=‘bglist-1‘>" + json[i].Creater + "</td></tr>";
}
var x = document.getElementById("divData");
x.innerHTML = x.innerHTML + strTemp;
现在不报错了，但是页面错乱了，div会放在了table前面了，而且是没有格子的。
3)第三版代码
<div id="divData">
</div>
var strTemp = " <table border=‘1‘><tr><th class=‘bglist-2‘>JO</th><th class=‘bglist-2‘>信息</th><th class=‘bglist-2‘> 掃描時間";
strTemp = strTemp + "</th><th class=‘bglist-2‘>掃描賬號</th></tr>";
for (var i = 0; i < json.length; i++) {
strTemp = strTemp + "</tr><tr><td class=‘bglist-1‘>"
+ json[i].JoNo + "</td><td class=‘bglist-1‘>" + json[i].Info
+ "</td><td class=‘bglist-1‘>" + new Date(parseInt(json[i].CreateTime.replace("/Date(", "").replace(")/", ""), 10)).toLocaleString()
+ "</td><td class=‘bglist-1‘>" + json[i].Creater + "</td></tr><tr>";
}
var x = document.getElementById("divData");
x.innerHTML = strTemp+"</table>";
整个世界清静了，大家都安分守己了，达到了要求
最终版本修改为Jquery版本，保证最大的兼容性。
$("#divData").html(strTemp + "</table>");
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
