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 相关文章推荐
js+数组实现网页上显示时间/星期几的实用方法
Jan 18 Javascript
Javascript级联下拉菜单以及AJAX数据验证核心代码
May 10 Javascript
判断文档离浏览器顶部的距离的方法
Jan 08 Javascript
浅谈jQuery异步对象(XMLHttpRequest)
Nov 17 Javascript
关于JS中prototype的理解
Sep 07 Javascript
jQuery获取父元素及父节点的方法小结
Apr 14 Javascript
理解javascript对象继承
Apr 17 Javascript
Bootstrap表单组件教程详解
Apr 26 Javascript
Three.js利用orbit controls插件(轨道控制)控制模型交互动作详解
Sep 25 Javascript
详解JavaScript中的数组合并方法和对象合并方法
May 11 Javascript
微信小程序生成二维码的示例代码
Mar 29 Javascript
vue悬浮可拖拽悬浮按钮的实例代码
Aug 20 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
最令PHP初学者们头痛的十四个问题
2007/01/15 PHP
php上传文件中文文件名乱码的解决方法
2013/11/01 PHP
PHP实现表单提交数据的验证处理功能【防SQL注入和XSS攻击等】
2017/07/21 PHP
Javascript实例教程(19) 使用HoTMetal(6)
2006/12/23 Javascript
在IE上直接编辑网页内容的js代码(IE地址栏js)
2009/04/27 Javascript
理解Javascript_07_理解instanceof实现原理
2010/10/15 Javascript
js中数组Array的一些常用方法总结
2013/08/12 Javascript
JQuery中操作Css样式的方法
2014/02/12 Javascript
jquery实现的省市区三级联动
2015/04/02 Javascript
JQuery radio(单选按钮)操作方法汇总
2015/04/15 Javascript
解决JavaScript数字精度丢失问题的方法
2015/12/03 Javascript
快速掌握Node.js中setTimeout和setInterval的使用方法
2016/03/21 Javascript
jQuery3.0中的buildFragment私有函数详解
2016/08/16 Javascript
微信小程序 实现tabs选项卡效果实例代码
2016/10/31 Javascript
JavaScript 中 apply 、call 的详解
2017/03/21 Javascript
Vue中&quot;This dependency was not found&quot;问题的解决方法
2018/06/19 Javascript
React+TypeScript+webpack4多入口配置详解
2019/08/08 Javascript
js、jquery实现列表模糊搜索功能过程解析
2020/03/27 jQuery
Element InputNumber计数器的使用方法
2020/07/27 Javascript
Vue+penlayers实现多边形绘制及展示
2020/12/24 Vue.js
利用Python获取操作系统信息实例
2016/09/02 Python
python获取代码运行时间的实例代码
2018/06/11 Python
python实现图书借阅系统
2019/02/20 Python
Puppeteer使用示例详解
2019/06/20 Python
Django利用elasticsearch(搜索引擎)实现搜索功能
2020/11/26 Python
Python 中如何使用 virtualenv 管理虚拟环境
2021/01/21 Python
html5表单及新增的改良元素详解
2016/06/07 HTML / CSS
澳大利亚最大的百货公司:Myer
2018/12/21 全球购物
Nike香港官网:Nike HK
2019/03/23 全球购物
如何提高JDBC的性能
2013/04/30 面试题
科室工作个人总结的自我评价
2013/10/29 职场文书
体育教育专业毕业生自荐信
2013/11/15 职场文书
书法培训心得体会
2014/01/05 职场文书
企业消防安全责任书
2014/07/23 职场文书
个人工作作风整改措施思想汇报
2014/10/13 职场文书
大学学生会主席竞选稿
2015/11/19 职场文书