Heim > Web-Frontend > js-Tutorial > Hauptteil

IE6-IE9不支持table.innerHTML的解决方法分享_javascript技巧

WBOY
Freigeben: 2016-05-16 17:50:04
Original
1031 Leute haben es durchsucht

测试代码:

复制代码 代码如下:



<script> <BR>var oTable=document.getElementById("test"); <BR>oTable.innerHTML="<tr><td>innerHTML"; <BR></script>


上述代码在IE6-9中无效,直接报错:
  IE9:Invalid target element for this operation.
  IE6-8:Unknown runtime error
  查找IE的文档(http://msdn.microsoft.com/en-us/library/ms533897(VS.85).aspx)后发现有这么一段:

The innerHTML property is read-only on the col, colGroup, frameSet, html, head, style, table, tBody, tFoot, tHead, title, and tr objects.

所以只能用其他方案解,我的方案:
复制代码 代码如下:

var oTable=document.getElementById("test");
//oTable.innerHTML="innerHTML";
setTableInnerHTML(oTable,"innerHTML");

function setTableInnerHTML(table, html) {
if(navigator && navigator.userAgent.match(/msie/i)){
var temp = table.ownerDocument.createElement('div');
temp.innerHTML = '' + html + '
';
if(table.tBodies.length == 0){
var tbody=document.createElement("tbody");
table.appendChild(tbody);
}
table.replaceChild(temp.firstChild.firstChild, table.tBodies[0]);
} else {
table.innerHTML=html;
}
}

这里只是对table做了处理,对其他不支持的元素可以用类似的方案。

  另外,IE10中table已经支持innerHTML了。

作者:Artwl
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage