JavaScript在IE下设置innerHTML时出现"未知的运行时错误"

最新推荐文章于 2016-04-26 14:47:09 发布
最新推荐文章于 2016-04-26 14:47:09 发布
阅读量892 收藏
点赞数
分类专栏： javascript html 文章标签： javascript ie error 浏览器 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/FuDesign2008/article/details/4793384
版权


问题

想动态的改变<p>标签的innerHTML内容,但在IE下却报"未知的运行时错误".

Html页面如下程序如下:

<html>
    <head>
    <title>test</title>
    </head>
    <body>
    <script>
    document.getElementById('trone').innerHTML = '<span>haha</span>';
    </script>
    <p id='trone'></p>
    </body>
</html>

原因

<script>标签在<p>标签之前, JavaScript代码执行时, 无法访问到<p>标签, 因为这时候<p>标签还未被浏览器解析.

建议将<script>标签放在页面底部, 除了可以避免以上问题, 还能提升性能(可参考Best Practices for Speeding Up Your Web Site 中 "Put Scripts at the Bottom").

扩展知识

即使<script>出现在被操作标签之后, 在IE下仍然可能出现该问题.

这主要因为IE在对innerHTML进行写操作的时候会检查被操作元素是否符合作为内容对象容器的要求. 比如, 如果在一个<p>标签里加入<li>标签，这很可能会出现以上的错误.如果发现这类错误出现,我们可以尝试做以下事情:

  1. 检查你尝试加到innerHTML的html代码是否包含破损的html标签，如没有<ul></ul>包围的<li></li>.
  2. 把被赋innerHTML的容器改成那些比较"包容"的标签，如<span>, <div>标签. 需要特别注意的是, 即使<tbody>,<table>, <tr>标签里面加正确格式的<td>标签都有可能出错, 所以应该避免使用这些标签作为容器.

参考

  1. JavaScript在IE下设置innerHTML时出现"未知的运行时错误"
  2. Best Practices for Speeding Up Your Web Site
FuDesign2008
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Javascript在IE下设置innerHTML时出现未知的运行时错误的解决方法
01-19
代码如下: [removed] document.getElementById(“trone”)[removed] = “<td>haha</td>”; [removed] <tr id=”trone”> </tr> 在IE中，有时候会出现”未知的运行时错误(unknown runtime error)”,而在firefox里不会。 这主要是IE在对innerHTML进行写操作的时候会检查element是否具备做为这些内容中html对象容器的要求，比如如果你是在一个p里加入包含<li>的html代码，这是会出错的。所以如果你发现这些错误出现，尝试做两件事情： 1、检查你尝试加到innerHT
IE使用innerHTML出现未知的运行时错误的原因
Willko's Blog
02-08 193
原因有两个 1.元素的innerHTML属性是只读。。 只读元素:COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR, INPUT, BR 2.HTML错误的嵌套例如在p里嵌套div那修改div的innerHTML属性也会出现错误...
IE innerHTML 未知运行时错误
weixin_34378045的博客
03-07 97
这主要是IE在对innerHTML进行写操作的时候会检查infoDIV是否具备做为这些内容中html对象容器的要求，所以当你发现这些错误出现，尝试做两件事情： 1、检查你尝试加到innerHTML的html代码是否包含破损的html标签（某些标签或许缺少关闭标签）. 2、把你的容器改成那些比较“包容”的标签，如 <span> </span>, <...
【转】JavaScript在IE下设置innerHTML时出现"未知的运行时错误"
{玖}单纯着，幸福着，思考着
04-26 212
今天在项目开发中遇到的比较郁闷的问题，特此记录： 程序代码思路大致如下,想动态的改变tr标签的innerHTML内容,但是IE却报"未知的运行时错误",让我百思不得其解. &lt;script&gt; document.getElementById('trone').innerHTML = '&lt;td&gt;haha&lt;/td&gt;'; &lt;/script&gt; &lt...
js插件设置innerHTML时在IE8下提示“未知运行时错误”解决方法
12-29
本文实例讲述了js插件设置innerHTML时在IE8下提示“未知运行时错误”解决方法。分享给大家供大家参考。具体分析如下： 问题描述： 网站中使用了一个js插件，设置innerHTML时，在IE8下报错“未知运行时错误”： ...
CodeMirror2 IE7/IE8 下面未知运行时错误的解决方法
09-05
总结起来，解决CodeMirror2在IE7/IE8下出现的“未知运行时错误”的关键在于理解`innerHTML`在老版本IE中的限制，以及调整HTML结构以避免使用不支持此属性的元素。通过将`textarea`移出`<p>`元素并放入`<div>`中，...
JavaScript在IE中“意外地调用了方法或属性访问”
10-30
在这段代码中，尝试通过设置`innerHTML`属性来修改`p`标签的内容，但在IE中直接插入`<CENTER>`标签会导致运行时错误。这是因为IE对某些特定的HTML标签有严格的限制。 4. **经典的“无法打开Internet站点”异常** ...
设置innerHTML时出现"未知的运行时错误
『 Ghost 』
10-23 2500
在Ajax里经常会通过innerHTML来改变界面，这个比使用DOM要简单一些。比如：element.innerHTML = "something"不过，在IE中，有时候会出现"未知的运行时错误(unknown runtime error)",而在firefox里不会。这主要是IE在对innerHTML进行写操作的时候会检查element是否具备做为这些内容中html对象容器的要求，比如如果你是在
JavaScript设置innerHTML时出现“未知的运行时错误”--我也遇上了
每天都有新发现
05-22 4751
以下是在Google的帮助下找到的解决方法：在Ajax里经常会通过innerHTML来改变界面，这个比使用DOM要简单一些。 比如： element.innerHTML = "something" 不过，在IE中，有时候会出现"未知的运行时错误(unknown runtime error)",而在firefox里不会。 这主要是IE在对innerHTML进行写
Mobile Web Development: 针对webkit的HTML, CSS和Javascript
热门推荐
FuDesign2008的专栏
06-11 2万+
针对webkit的HTML, CSS和Javascript 前面有一篇文章介绍了HTML5的一些新特性以及技巧, 现再来总结一些更多的针对webkit的HTML, CSS和Javascript方面的特性. HTML, 从HTML文档的开始到结束排列: 让内容的宽度自适应为设备的宽度, 在做Mobile Web时必须加的一条 禁用手机号码链
javascript innerhtml
最新发布
06-28
### 回答1： JavaScript的innerHTML是一种属性，它允许您通过JavaScript代码更改HTML元素的内容。使用innerHTML，您可以将新的HTML代码插入到现有元素中，也可以更改现有元素的文本内容。它是一种非常强大和灵活的工具，可以帮助您动态地更新和修改网页内容。 ### 回答2： JavaScript innerHTML 是一种非常常用的方法，用于获取或设置 HTML 元素的内容。它的主要作用是通过 JavaScript 来修改 HTML 元素的内容。例如，当我们需要动态更新网页上的某些元素的内容时，可以使用 innerHTML 方法来实现。 使用 innerHTML 方法获取元素的值，我们只需要获取该元素的 innerHTML 属性即可。例如： var element = document.getElementById('example'); var content = element.innerHTML; console.log(content); 这里我们首先使用 getElementById 方法获取了 ID 为 example 的 HTML 元素，然后使用 innerHTML 属性获取该元素的内容，并将其输出到控制台中。 使用 innerHTML 方法设置元素的值，我们只需要通过该方法给该元素的 innerHTML 属性设置一个新的值即可。例如： var element = document.getElementById('example'); element.innerHTML = '新的内容'; 这里我们使用 getElementById 方法获取了 ID 为 example 的 HTML 元素，然后将其 innerHTML 属性设置为 '新的内容'。 需要注意的是，innerHTML 方法会覆盖当前元素的所有子元素，包括文本节点和其他 HTML 元素，因此在使用 innerHTML 方法时需要格外小心，以免不小心破坏网页的布局和结构。另外，innerHTML 方法也会在一定程度上影响网页的性能，因此在操作大量 HTML 元素时需要特别注意。 ### 回答3： JavaScript的innerHTML是一种非常强大的属性，它使网页开发者可以通过JavaScript脚本语言来修改HTML文档中的内容。 使用innerHTML，可以实现对HTML文档内的内容实现动态的改变或者替换。比如，需要根据用户在网页上选择的不同选项来不断地向页面上添加新的列表项。这时候就可以使用innerHTML属性，将这些新项目添加到现有的列表项中。 innerHTML属性的另一个重要的功能是，它可以让JavaScript和HTML代码之间实现更好的交互性。因为，使用innerHTML属性可以实现对HTML页面上元素的定位和修改，这使得能够更容易地动态地调整网页的布局和样式。 当然，需要注意的是，innerHTML属性也有其局限性。它不能直接修改网页的CSS样式或者描述编写模式，因此在某些情况下，需要使用其他的技术来实现相关的功能。 总的来说，innerHTML是一种非常重要的属性，它在JavaScript开发中扮演了重要的角色。如果能够有效地掌握这项技术，那么就可以大大提高网页开发的效率并且实现更为灵活的页面效果。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值