innerHTML在IE中报错解决方案


Posted in Javascript onDecember 15, 2014

问题:开发过程中,用到循环往table里面插入tr标签,然后tr里又循环插入td,在其它浏览器都没问题,但是在IE9及以下版本中都报错:

innerHTML在IE中报错解决方案

google上得到答案:由于我之前不知道错误的原因,在百度找不到解决方法,后来用谷歌搜到了,外国有人也遇到过这个问题,并指出了问题的所在:http://www.aachin.info/techen/error-on-ie-9-script600-invalid-target-element-for-this-operation/?amp;utm_source=rss&utm_medium=rss&utm_campaign=error-on-ie-9-script600-invalid-target-element-for-this-operationinnerHTML在IE中报错解决方案演示代码:

<!DOCTYPE html>

<html lang="zh-cn">

    <head>

        <meta http-equiv="content-type" content="text/html;charset=utf-8" />

        <title>默认标题</title>

    </head>

    <body>

        <table id="mytable" border="1" cellpadding="1" cellspacing="0">

            <tr>

                <td>222</td>

            </tr>

        </table>

        <script type="text/javascript">

            var mytable = document.getElementById('mytable');

            var tr = mytable.getElementsByTagName('tr')[0];

            var td = mytable.getElementsByTagName('td')[0];

            

            //读取innerHTML(IE任何版本都不报错,IE6未测)

            alert(mytable.innerHTML);

            alert(tr.innerHTML);

            alert(td.innerHTML);

            

            //写入innerHTML

            // mytable.innerHTML = '<tr><td>11111</td></tr>'; //IE9及以下报错

            // tr.innerHTML = '<td>11111</td>';    //IE9及以下报错

            // td.innerHTML = '11111';            //所有版本不报错(IE6未测)

            

            //解决方法,使用DOM的原始操作方法或者表格操作方法

            // var btnRow = mytable.insertRow();

            // var cell = btnRow.insertCell(btnRow.getElementsByTagName('td').length);

            // cell.innerHTML = "some html text";

        </script>

    </body>

</html>

得出结论:IE9及以下版本的table以及tr的innerHTML属性都是只读的,你可以用它读取table或者tr中的值,但不能写入,写入就报错,另外在IE9及以下版本中td的innerHTML可读可写。解决方法:使用原始的DOM操作方法或者表格操作方法见演示代码。

Javascript 相关文章推荐
Javascript客户端将指定区域导出到Word、Excel的代码
Oct 22 Javascript
jQuery 事件队列调整方法
Sep 18 Javascript
js 使FORM表单的所有元素不可编辑的示例代码
Oct 17 Javascript
获取下拉列表框的值是数组,split,$.inArray示例
Nov 13 Javascript
js实现动态改变字体大小代码
Jan 02 Javascript
Angular中$compile源码分析
Jan 28 Javascript
JS面向对象(3)之Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
Feb 25 Javascript
JS模拟bootstrap下拉菜单效果实例
Jun 17 Javascript
Webpack中css-loader和less-loader的使用教程
Apr 27 Javascript
JS库之Highlight.js的用法详解
Sep 13 Javascript
Node.js利用断言模块assert进行单元测试的方法
Sep 28 Javascript
基于JS实现html中placeholder属性提示文字效果示例
Apr 19 Javascript
node.js中的fs.ftruncate方法使用说明
Dec 15 #Javascript
node.js中的fs.fsyncSync方法使用说明
Dec 15 #Javascript
node.js中的fs.writeSync方法使用说明
Dec 15 #Javascript
node.js中的fs.write方法使用说明
Dec 15 #Javascript
node.js中的http.createClient方法使用说明
Dec 15 #Javascript
node.js中的http.get方法使用说明
Dec 14 #Javascript
node.js中的http.createServer方法使用说明
Dec 14 #Javascript
You might like
多重?l件?合查?(二)
2006/10/09 PHP
PHP关于IE下的iframe跨域导致session丢失问题解决方法
2013/10/10 PHP
PHP XML和数组互相转换详解
2016/10/26 PHP
php使用PDO执行SQL语句的方法分析
2017/02/16 PHP
实现php删除链表中重复的结点
2018/09/27 PHP
HR vs ForZe BO3 第一场 2.13
2021/03/10 DOTA
js 鼠标点击事件及其它捕获
2009/06/04 Javascript
利用location.hash实现跨域iframe自适应
2010/05/04 Javascript
非html5实现js版弹球游戏示例代码
2013/09/22 Javascript
用JavaScript实现类似于ListBox功能示例代码
2014/03/09 Javascript
JavaScript使用setInterval()函数实现简单轮询操作的方法
2015/02/02 Javascript
谈谈JavaScript异步函数发展历程
2015/09/29 Javascript
jQuery3.0中的buildFragment私有函数详解
2016/08/16 Javascript
node.js版本管理工具n无效的原理和解决方法
2016/11/24 Javascript
jQuery实现倒计时(倒计时年月日可自己输入)
2016/12/02 Javascript
jQuery中值得注意的trigger方法浅析
2016/12/12 Javascript
jQuery Ajax实现跨域请求
2017/01/21 Javascript
解决axios发送post请求返回400状态码的问题
2018/08/11 Javascript
解决vue单页面修改样式无法覆盖问题
2019/08/05 Javascript
JS实现页面数据懒加载
2020/02/13 Javascript
vue实现匀速轮播效果
2020/06/29 Javascript
Python实现模拟登录及表单提交的方法
2015/07/25 Python
python使用正则表达式替换匹配成功的组并输出替换的次数
2017/11/22 Python
Python网络编程之使用TCP方式传输文件操作示例
2019/11/01 Python
pytorch自定义二值化网络层方式
2020/01/07 Python
PyCharm无法识别PyQt5的2种解决方法,ModuleNotFoundError: No module named 'pyqt5'
2020/02/17 Python
对于没有初始化的变量的初始值可以作怎样的假定
2014/10/12 面试题
职业技术学校毕业生推荐信
2013/12/03 职场文书
企划主管岗位职责
2013/12/12 职场文书
求职简历中个人的自我评价
2013/12/25 职场文书
活动倡议书范文
2014/05/13 职场文书
学习退步检讨书
2014/09/28 职场文书
基石观后感
2015/06/12 职场文书
灵魂歌王观后感
2015/06/17 职场文书
初中毕业感言300字
2015/07/31 职场文书
2016廉政教育学习心得体会
2016/01/25 职场文书