6

我尝试在 Firefox 中的一个元素上设置 innerHTML，它运行良好，在 IE 中尝试过，但没有明显原因出现意外错误。

例如，如果您尝试将表格的 innerHTML 设置为“hi from stu”，它将失败，因为表格后面必须有一个序列。

4

10 回答 10

14

您会看到这种行为，因为 innerHTML 对于 IE 中的表格元素是只读的。来自 MSDN 的innerHTML 属性文档：

该属性对所有对象都是读/写的，除了以下对象，它是只读的：COL、COLGROUP、FRAMESET、HEAD、HTML、STYLE、TABLE、TBODY、TFOOT、THEAD、TITLE、TR。

于 2008-10-31T22:45:49.983 回答
3

不知道为什么你会因为 Stu 的问题而被降级，因为这是我最近解决的问题。诀窍是将 HTML “喷射”到当前未附加到文档树的 DOM 元素中。这是执行此操作的代码片段：

// removing the scripts to avoid any 'Permission Denied' errors in IE
var cleaned = html.replace(/<script(.|\s)*?\/script>/g, "");

// IE is stricter on malformed HTML injecting direct into DOM. By injecting into 
// an element that's not yet part of DOM it's more lenient and will clean it up.
if (jQuery.browser.msie)
{
    var tempElement = document.createElement("DIV");
    tempElement.innerHTML = cleaned;
    cleaned = tempElement.innerHTML;
    tempElement = null;
}
// now 'cleaned' is ready to use...

请注意，我们在此代码段中仅使用 jQuery 来测试浏览器是否为 IE，对 jQuery 没有硬依赖。

于 2008-10-02T09:24:28.590 回答
1

检查您尝试设置 innerHTML 的元素的范围。因为 FF 和 IE 以不同的方式处理这个问题

于 2008-10-31T22:33:52.270 回答
1

http://www.ericvasilik.com/2006/07/code-karma.html

于 2009-03-03T15:27:59.000 回答
1

我一直在与用不同的链接列表替换表中的链接列表的问题作斗争。如上所述，问题来自 IE 及其表元素的只读属性。

Append 对我来说不是一个选项，所以我（最终）解决了这个问题（适用于 Ch、FF 和 IE 8.0（尚未尝试其他 - 但我很有希望））。

replaceInReadOnly(document.getElementById("links"), "<a href>........etc</a>");

function replaceInReadOnly(element, content){
    var newNode = document.createElement();
    newNode.innerHTML = content;
    var oldNode = element.firstChild;
    var output = element.replaceChild(newNode, oldNode);
}

对我有用 - 我希望它对你有用

于 2010-09-22T08:10:56.157 回答
0

“显然 firefox 不是那么挑剔” ==> 显然 FireFox 是如此的错误，以至于它没有注册这种明显违反基本 html 嵌套规则的行为......

正如有人在另一个论坛中指出的那样，FireFox 将接受，您将整个 html 文档附加为表单域甚至图像的子项，-(

于 2008-10-01T03:53:51.687 回答
0

您是否尝试过设置 innerText 和/或 textContent？当您尝试在 IE 中更改它们的 innerHTML 时，某些节点（如 SCRIPT 标记）的行为将不会像预期的那样。更多关于 innerText 与 textContent 的信息：

http://blog.coderlab.us/2006/04/18/the-textcontent-and-innertext-properties/

于 2008-10-01T16:11:52.147 回答
0

您是在设置完全不同的 innerHTML 还是替换了 innerHTML 中的模式？我问是因为如果您尝试通过 innerHTML 的“功能”进行简单的搜索/替换，您会发现某些类型的元素不在 IE 中播放。

这可以通过在 try/catch 中包围您的尝试并通过 parentNode 冒泡 DOM 直到您成功地做到这一点来谨慎地解决。

但是，如果您要插入全新的内容，这将不合适。

于 2008-10-31T22:30:11.153 回答
0

您可以修改行为。下面是一些代码，可以防止在 IE 中对其他引用的元素进行垃圾收集：

if (/(msie|trident)/i.test(navigator.userAgent)) {
 var innerhtml_get = Object.getOwnPropertyDescriptor(HTMLElement.prototype, "innerHTML").get
 var innerhtml_set = Object.getOwnPropertyDescriptor(HTMLElement.prototype, "innerHTML").set
 Object.defineProperty(HTMLElement.prototype, "innerHTML", {
  get: function () {return innerhtml_get.call (this)},
  set: function(new_html) {
   var childNodes = this.childNodes
   for (var curlen = childNodes.length, i = curlen; i > 0; i--) {
    this.removeChild (childNodes[0])
   }
   innerhtml_set.call (this, new_html)
  }
 })
}

var mydiv = document.createElement ('div')
mydiv.innerHTML = "test"
document.body.appendChild (mydiv)

document.body.innerHTML = ""
console.log (mydiv.innerHTML)

http://jsfiddle.net/DLLbc/9/

于 2014-01-21T07:21:52.710 回答
-2

我刚刚发现，如果您尝试在 IE 中不正确的元素上设置 innerHTML，则会引发此错误。例如，如果您尝试将表格的 innerHTML 设置为“ hi from stu ”，它将失败，因为表格后面必须有一个序列。显然firefox不是那么挑剔。希望能帮助到你。

于 2008-09-30T22:43:26.720 回答