在IE下给DIV设置innerHTML时发生,未知运行时错误

时间:2022-11-17 12:20:17
和很多朋友说的一样,在Firefox下可以正常使用,但在IE下就会有未知运行时错误

已经找过了不少同样是运行时错误的,但很少看到给div设置错误的,有些朋友说解决这未知运行错误的方法就是使用DIV,但现在方法对我是没效的,因为我现在就是使用DIV
还有些朋友说不认某些标签,但我这里使用的已经是最基本的了,<table>,<tr><td>< textarea><input>,而且这些标签之前在其它项目中使用过,没有问题

详细的代码内容如下,在运行这句时,在IE下会报未知运行时错误,但在Firefox,Opera,chrom下运行都没问题!
document.getElementById("infoDIV").innerHTML="<table ><tr><td nowrap align='right'>ID:</td><td nowrap align='left'>18</td></tr>

<tr><td nowrap align='right'>合同编号:</td><td nowrap align='left'>d200905200003</td></tr>

<tr><td nowrap align='right'>甲方:</td><td nowrap align='left'>re</td></tr>

<tr><td nowrap align='right'>乙方:</td><td nowrap align='left'>34re</td></tr>

<tr><td nowrap align='right'>合同类型:</td><td nowrap align='left'>正式合同</td></tr>

<tr><td nowrap align='right'>签定类型:</td><td nowrap align='left'>一次续签</td></tr>

<tr><td nowrap align='right'>合同期限:</td><td nowrap align='left'>三个月</td></tr>

<tr><td nowrap align='right'>试用开始日期:</td><td nowrap align='left'>2009-05-12 </td></tr>

<tr><td nowrap align='right'>试用结束日期:</td><td nowrap align='left'>2009-05-15</td></tr>

<tr><td nowrap align='right'>合同结束日期:</td><td nowrap align='left'>2009-05-19</td></tr>

<tr><td nowrap align='right'>甲方re签字日期:</td><td nowrap align='left'>2009-05-05</td></tr>

<tr><td nowrap align='right'>乙方34re签字日期:</td><td nowrap align='left'>2009-05-23</td></tr>

<tr><td nowrap align='right'>合同生效日期:</td><td nowrap align='left'>2009-05-23</td></tr>

<tr><td nowrap align='right'>合同条款:</td><td><textarea readonly='readonly' rows='10' cols='100'>aaaaaaaaaaaaaaaaaaaaa;

bbbbbbbbbbbbbbbbbbbbbbbb;

ccccccccccccccccccccc;</textarea></td></tr>

<tr><td nowrap align='right'>是否启用:</td><td nowrap align='left'>Y</td></tr>

<tr><td nowrap align='right'>&nbsp;</td><td nowrap align='left'><input type='button'  value='返回' onclick='closwClienWindow();'></td></tr>

</table>";

9 个解决方案

#1


注意换行。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function a(){
document.getElementById('infoDIV').innerHTML="<table><tr><td nowrap align=\"right\">ID:</td><td nowrap align=\"left\">18</td></tr><tr><td nowrap align=\"right\">合同编号:</td><td nowrap align=\"left\">d200905200003</td></tr><tr><td nowrap align=\"right\">甲方:</td><td nowrap align=\"left\">re</td></tr><tr><td nowrap align=\"right\">乙方:</td><td nowrap align=\"left\">34re</td></tr><tr><td nowrap align=\"right\">合同类型:</td><td nowrap align=\"left\">正式合同</td></tr><tr><td nowrap align=\"right\">签定类型:</td><td nowrap align=\"left\">一次续签</td></tr><tr><td nowrap align=\"right\">合同期限:</td><td nowrap align=\"left\">三个月</td></tr><tr><td nowrap align=\"right\">试用开始日期:</td><td nowrap align=\"left\">2009-05-12 </td></tr><tr><td nowrap align=\"right\">试用结束日期:</td><td nowrap align=\"left\">2009-05-15</td></tr><tr><td nowrap align=\"right\">合同结束日期:</td><td nowrap align=\"left\">2009-05-19</td></tr><tr><td nowrap align=\"right\">甲方re签字日期:</td><td nowrap align=\"left\">2009-05-05</td></tr><tr><td nowrap align=\"right\">乙方34re签字日期:</td><td nowrap align=\"left\">2009-05-23</td></tr><tr><td nowrap align=\"right\">合同生效日期:</td><td nowrap align=\"left\">2009-05-23</td></tr><tr><td nowrap align=\"right\">合同条款:</td><td><textarea readonly=\"readonly\" rows=\"10\" cols=\"100\">aaaaaaaaaaaaaaaaaaaaa;bbbbbbbbbbbbbbbbbbbbbbbb;ccccccccccccccccccccc;</textarea></td></tr><tr><td nowrap align=\"right\">是否启用:</td><td nowrap align=\"left\">Y</td></tr><tr><td nowrap align=\"right\">&nbsp;</td><td nowrap align=\"left\"><input type=\"button\"  value=\"返回\" onclick=\"closwClienWindow();\"></td></tr></table>";
}
</script>
</head>

<body>
<div id="infoDIV"></div>
<input type="button" value="oo" onclick="a();" />
</body>
</html>

#2


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function a(){
document.getElementById('infoDIV').innerHTML="<table>"+
"<tr>"+
"<td nowrap align=\"right\">ID:</td>"+
"<td nowrap align=\"left\">18</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同编号:</td>"+
"<td nowrap align=\"left\">d200905200003</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">甲方:</td>"+
"<td nowrap align=\"left\">re</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">乙方:</td>"+
"<td nowrap align=\"left\">34re</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同类型:</td>"+
"<td nowrap align=\"left\">正式合同</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">签定类型:</td>"+
"<td nowrap align=\"left\">一次续签</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同期限:</td>"+
"<td nowrap align=\"left\">三个月</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">试用开始日期:</td>"+
"<td nowrap align=\"left\">2009-05-12 </td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">试用结束日期:</td>"+
"<td nowrap align=\"left\">2009-05-15</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同结束日期:</td>"+
"<td nowrap align=\"left\">2009-05-19</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">甲方re签字日期:</td>"+
"<td nowrap align=\"left\">2009-05-05</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">乙方34re签字日期:</td>"+
"<td nowrap align=\"left\">2009-05-23</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同生效日期:</td>"+
"<td nowrap align=\"left\">2009-05-23</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同条款:</td>"+
"<td><textarea readonly=\"readonly\" rows=\"10\" cols=\"100\">aaaaaaaaaaaaaaaaaaaaa;bbbbbbbbbbbbbbbbbbbbbbbb;ccccccccccccccccccccc;</textarea></td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">是否启用:</td>"+
"<td nowrap align=\"left\">Y</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">&nbsp;</td>"+
"<td nowrap align=\"left\"><input type=\"button\"  value=\"返回\" onclick=\"closwClienWindow();\"></td>"+
"</tr>"+
"</table>";
}
</script>
</head>

<body>
<div id="infoDIV"></div>
<input type="button" value="oo" onclick="a();" />
</body>
</html>

#3


这主要是IE在对innerHTML进行写操作的时候会检查infoDIV是否具备做为这些内容中html对象容器的要求,所以当你发现这些错误出现,尝试做两件事情: 

1、检查你尝试加到innerHTML的html代码是否包含破损的html标签(某些标签或许缺少关闭标签).  
2、把你的容器改成那些比较“包容”的标签,如<span></span>,<div></div> 

特别注意的是<tbody>,<table>,<tr>标签里面加正确格式的<td>标签都有可能出错,所以应该避免使用这些标签作为容器。
必要时可以用<td>作为容器,再锲套一层表格

注:
1.元素的innerHTML属性是只读。。
只读元素:COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR

2.HTML错误的嵌套例如在p里嵌套div那修改div的innerHTML属性也会出现错误

#4


楼主你这样子肯定会报错吧
分行写一个字符串是不是应该有个连接吧!

#5


直接用dom的方式操作吧,简洁明了,出错了容易修改

#6


lzw1987andy:你的说的问题已经试过了,在直接使用时是正常的,
测试跳出窗口中用也正常
但就是在我的项目中使用就出问题!真郁闷呀!!唉........

#7


我是使用jquery的AJAX从后台得到的数据,将返回来的data再写到这div上的,

#8


这问题还是没解决!唉!
最后还是选择了使用已有的JS组件来的!省得自己再从头写!
但还是谢谢大家的热心帮助!

#9


我的就是没有结束符号

#1


注意换行。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function a(){
document.getElementById('infoDIV').innerHTML="<table><tr><td nowrap align=\"right\">ID:</td><td nowrap align=\"left\">18</td></tr><tr><td nowrap align=\"right\">合同编号:</td><td nowrap align=\"left\">d200905200003</td></tr><tr><td nowrap align=\"right\">甲方:</td><td nowrap align=\"left\">re</td></tr><tr><td nowrap align=\"right\">乙方:</td><td nowrap align=\"left\">34re</td></tr><tr><td nowrap align=\"right\">合同类型:</td><td nowrap align=\"left\">正式合同</td></tr><tr><td nowrap align=\"right\">签定类型:</td><td nowrap align=\"left\">一次续签</td></tr><tr><td nowrap align=\"right\">合同期限:</td><td nowrap align=\"left\">三个月</td></tr><tr><td nowrap align=\"right\">试用开始日期:</td><td nowrap align=\"left\">2009-05-12 </td></tr><tr><td nowrap align=\"right\">试用结束日期:</td><td nowrap align=\"left\">2009-05-15</td></tr><tr><td nowrap align=\"right\">合同结束日期:</td><td nowrap align=\"left\">2009-05-19</td></tr><tr><td nowrap align=\"right\">甲方re签字日期:</td><td nowrap align=\"left\">2009-05-05</td></tr><tr><td nowrap align=\"right\">乙方34re签字日期:</td><td nowrap align=\"left\">2009-05-23</td></tr><tr><td nowrap align=\"right\">合同生效日期:</td><td nowrap align=\"left\">2009-05-23</td></tr><tr><td nowrap align=\"right\">合同条款:</td><td><textarea readonly=\"readonly\" rows=\"10\" cols=\"100\">aaaaaaaaaaaaaaaaaaaaa;bbbbbbbbbbbbbbbbbbbbbbbb;ccccccccccccccccccccc;</textarea></td></tr><tr><td nowrap align=\"right\">是否启用:</td><td nowrap align=\"left\">Y</td></tr><tr><td nowrap align=\"right\">&nbsp;</td><td nowrap align=\"left\"><input type=\"button\"  value=\"返回\" onclick=\"closwClienWindow();\"></td></tr></table>";
}
</script>
</head>

<body>
<div id="infoDIV"></div>
<input type="button" value="oo" onclick="a();" />
</body>
</html>

#2


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function a(){
document.getElementById('infoDIV').innerHTML="<table>"+
"<tr>"+
"<td nowrap align=\"right\">ID:</td>"+
"<td nowrap align=\"left\">18</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同编号:</td>"+
"<td nowrap align=\"left\">d200905200003</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">甲方:</td>"+
"<td nowrap align=\"left\">re</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">乙方:</td>"+
"<td nowrap align=\"left\">34re</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同类型:</td>"+
"<td nowrap align=\"left\">正式合同</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">签定类型:</td>"+
"<td nowrap align=\"left\">一次续签</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同期限:</td>"+
"<td nowrap align=\"left\">三个月</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">试用开始日期:</td>"+
"<td nowrap align=\"left\">2009-05-12 </td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">试用结束日期:</td>"+
"<td nowrap align=\"left\">2009-05-15</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同结束日期:</td>"+
"<td nowrap align=\"left\">2009-05-19</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">甲方re签字日期:</td>"+
"<td nowrap align=\"left\">2009-05-05</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">乙方34re签字日期:</td>"+
"<td nowrap align=\"left\">2009-05-23</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同生效日期:</td>"+
"<td nowrap align=\"left\">2009-05-23</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">合同条款:</td>"+
"<td><textarea readonly=\"readonly\" rows=\"10\" cols=\"100\">aaaaaaaaaaaaaaaaaaaaa;bbbbbbbbbbbbbbbbbbbbbbbb;ccccccccccccccccccccc;</textarea></td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">是否启用:</td>"+
"<td nowrap align=\"left\">Y</td>"+
"</tr>"+
"<tr>"+
"<td nowrap align=\"right\">&nbsp;</td>"+
"<td nowrap align=\"left\"><input type=\"button\"  value=\"返回\" onclick=\"closwClienWindow();\"></td>"+
"</tr>"+
"</table>";
}
</script>
</head>

<body>
<div id="infoDIV"></div>
<input type="button" value="oo" onclick="a();" />
</body>
</html>

#3


这主要是IE在对innerHTML进行写操作的时候会检查infoDIV是否具备做为这些内容中html对象容器的要求,所以当你发现这些错误出现,尝试做两件事情: 

1、检查你尝试加到innerHTML的html代码是否包含破损的html标签(某些标签或许缺少关闭标签).  
2、把你的容器改成那些比较“包容”的标签,如<span></span>,<div></div> 

特别注意的是<tbody>,<table>,<tr>标签里面加正确格式的<td>标签都有可能出错,所以应该避免使用这些标签作为容器。
必要时可以用<td>作为容器,再锲套一层表格

注:
1.元素的innerHTML属性是只读。。
只读元素:COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR

2.HTML错误的嵌套例如在p里嵌套div那修改div的innerHTML属性也会出现错误

#4


楼主你这样子肯定会报错吧
分行写一个字符串是不是应该有个连接吧!

#5


直接用dom的方式操作吧,简洁明了,出错了容易修改

#6


lzw1987andy:你的说的问题已经试过了,在直接使用时是正常的,
测试跳出窗口中用也正常
但就是在我的项目中使用就出问题!真郁闷呀!!唉........

#7


我是使用jquery的AJAX从后台得到的数据,将返回来的data再写到这div上的,

#8


这问题还是没解决!唉!
最后还是选择了使用已有的JS组件来的!省得自己再从头写!
但还是谢谢大家的热心帮助!

#9


我的就是没有结束符号