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

今天在项目开发中遇到的比较郁闷的问题,特此记录:

程序代码思路大致如下,想动态的改变tr标签的innerHTML内容,但是IE却报"未知的运行时错误",让我百思不得其解.

<script>

document.getElementById('trone').innerHTML = '<td>haha</td>';

</script>

<tr id=‘trone’></tr>

在网上一段查找获得以下解法:

在Ajax里经常会通过innerHTML来改变界面,这个比使用DOM要简单一些。
比如:
element.innerHTML = "<b>something</b>"
不过,在IE中,有时候会出现"未知的运行时错误(unknown runtime error)",而在firefox里不会。

这主要是IE在对innerHTML进行写操作的时候会检查element是否具备做为这些内容中html对象容器的要求,比如如果你是在一个p里加入包含<li>的html代码,这是会出错的。所以如果你发现这些错误出现,尝试做两件事情:

1、检查你尝试加到innerHTML的html代码是否包含破损的html标签,如没有<ul></ul>包围的<li></li>.
2、把你的容器改成那些比较“包容”的标签,如<span></span>,<div></div>

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

 

--------------------------------------------------------------------------------------------

IE中使用JavaScript中调用form.submit()提示“对象不支持此属性和方法”问题研究

----------------------------------------------------------------------------------------------

首先我们看看以下代码,页面的功能和逻辑很简单。

这段代码从逻辑上看没有任何错误和BUG,理论上是可以完全执行的。

<html>
    <head>IE 测试</head>
<body>
<script language="javascript">

function dosubmit()
{
   
var theform = document.getElementById('theform');
    theform.submit();
}
</script>
    <form method="post" id="theform">
        <table width="800">
            <tr>
                <td><input type="text" value="测试"></td>
            </tr>
            <tr>
                <td><input type="button" name="submit" value="提交" οnclick="dosubmit()"></td>
            </tr>
        </table>
    </form>
</body>
</html>

 

 

 

如果用Firefox查看这个页面并点击提交按钮,表单会正常提交,但是我们换到IE下面,IE却会提示“对象不支持此属性和方法“ 而停止提交的操作。

这是怎么回事呢?经过我多方的查找资料,发现是提交按钮的name="submit"的属性在捣乱。

此时我们将theform.submit();注释掉,新起一行输入alert(theform.submit.value);刷新页面后再次点击提交,弹出的窗口上会显示”提交“两个字,神奇了!theform.submit居然是提交按钮而不是theform的方法了!

为什么会出现这个问题呢,因为在IE下可以通过 表单.表单元素名称 这样的方式获得一个表单下的所有表单元素,但是巧就巧在这里,如果某个表单元素的名称和表单的方法名重名的话那么IE就会优先将名称解析为某个表单元素,而不是表单的方法,此时就会出现这个神奇的问题了。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: JavaScriptinnerHTML是一种属性,它允许您通过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: JavaScriptinnerHTML是一种非常强大的属性,它使网页开发者可以通过JavaScript脚本语言来修改HTML文档中的内容。 使用innerHTML,可以实现对HTML文档内的内容实现动态的改变或者替换。比如,需要根据用户在网页上选择的不同选项来不断地向页面上添加新的列表项。这候就可以使用innerHTML属性,将这些新项目添加到现有的列表项中。 innerHTML属性的另一个重要的功能是,它可以让JavaScriptHTML代码之间实现更好的交互性。因为,使用innerHTML属性可以实现对HTML页面上元素的定位和修改,这使得能够更容易地动态地调整网页的布局和样式。 当然,需要注意的是,innerHTML属性也有其局限性。它不能直接修改网页的CSS样式或者描述编写模式,因此在某些情况下,需要使用其他的技术来实现相关的功能。 总的来说,innerHTML是一种非常重要的属性,它在JavaScript开发中扮演了重要的角色。如果能够有效地掌握这项技术,那么就可以大大提高网页开发的效率并且实现更为灵活的页面效果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值