Home  >  Article  >  Web Front-end  >  IE6-IE9 does not support table.innerHTML solution sharing_javascript skills

IE6-IE9 does not support table.innerHTML solution sharing_javascript skills

WBOY
WBOYOriginal
2016-05-16 17:50:041031browse

Test code:

Copy code The code is as follows:


<script> <br>var oTable=document.getElementById("test"); <br>oTable.innerHTML="<tr><td>innerHTML</ td></tr>"; <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, 제목, tr objects.

따라서 다른 솔루션만 사용할 수 있습니다. 내 솔루션:
복사 코드 코드는 다음과 같습니다.

var oTable=document.getElementById("test")
//oTable.innerHTML="< tr>< ;td>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]);
table.innerHTML=html;
}
}

여기서는 지원되지 않는 다른 요소에 대해서만 유사한 솔루션을 사용할 수 있습니다.

또한 IE10의 테이블은 이미 innerHTML을 지원합니다.

작가: Artwl
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn