【转】IE6/7/8/9中Table/Select的innerHTML赋值会报错

秦巛骨

浏览: 8311 次
性别:
来自: 福建

最近访客更多访客>>

myleilo

woodding2008

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

JavaScript Chrome HTML5 HTML EXT

IE6/7/8/9中Table/Select的innerHTML赋值会报错，如下

01
<!DOCTYPE HTML> 

02

<html> 

03

<head> 

04

<meta charset="utf-8"> 

05

<title>IE6/7/8/9中TABLE的innerHTML不能赋值</title> 

06

</head> 

07

<body> 

08

<script type="text/javascript"> 

09
try{ 

10
var table = document.createElement('table'); 

11

table.innerHTML = '<tr><td>Test <FONT style="BACKGROUND-COLOR: #00ffff">table innerHTML</FONT></td></tr>' 

12
document.body.appendChild(table); 

13
}catch(e){ 

14
alert(e); 

15
} 

16

</script> 

17

</body> 

18

</html>

IE6/7 :

IE8 :

IE9 :

Firefox/Safari/Chrome/Opera中正常。Ext.DomHelper中使用div，把table添加到div中间接实现。

MSDN 写道

The property is read/write for all objects except the following, for which it is read-only: COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR. The property has no default value.
DHTML expressions can be used in place of the preceding value(s). As of Internet Explorer 8, expressions are not supported in IE8 mode. For more information, see About Dynamic Properties.

Select元素的innerHTML也不能赋值，

01
<!DOCTYPE HTML> 

02

<html> 

03

<head> 

04

<meta charset="utf-8"> 

05

<title>IE6/7/8/9中Select的innerHTML不能赋值</title> 

06

</head> 

07

<body> 

08

<script type="text/javascript"> 

09
try{ 

10
var select = document.createElement("select"); 

11

select.innerHTML = '<option value="1">one</option>'; 

12
document.body.appendChild(select); 

13
}catch(e){ 

14
alert(e); 

15
} 

16

</script> 

17

</body> 

18

</html>