在 Internet Explorer 中替换 document.documentElement.innerHTML
Posted
技术标签:
【中文标题】在 Internet Explorer 中替换 document.documentElement.innerHTML【英文标题】：Replacing document.documentElement.innerHTML in Internet Explorer 【发布时间】：2012-01-16 21:27:59 【问题描述】：以下在所有其他浏览器中都能完美运行（据我所知）：
document.documentElement.innerhtml = "<head></head><body>Testing</body>";
但是在 IE 中阻塞（我测试了 IE9），出现控制台错误：
SCRIPT600: Invalid target element for this operation.
...引用上面代码行的第一个字符。
为什么这在 IE 中不起作用，但在所有其他浏览器中都起作用？我在某处读到 innerHTML 在替换“TBODY”元素时出现问题，但我在删除所有 TBODY 子元素后测试了这行代码，并发生了同样的错误。
我知道这听起来像是坏消息代码，但这是我不得不使用的非常有限且过于简单的 CMS 网站的唯一选择。我只感谢 CMS 允许执行脚本。
本质上，我需要能够完全消化 HTML 内容并使用我自己的内容。同样，这在其他浏览器上也能正常工作。
其他说明：
CMS 正在使用prototype.js 库（在我运行此代码之前它已经加载）
文档类型为：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
CMS 脚本使用 prototype.js 在页面加载时动态添加两个充满内容的 divs
【问题讨论】：
我的情况是这样吗？ ***.com/a/255180/435596 我永远无法在 IE 中更改HEAD 或 HTML 的内容吗？
是的，你找到了正确的答案； innerHTML 是只读的，即使对于 IE 中的 <html> 元素，直到版本 9。无论如何，我认为替换 document.body.innerHTML 和 document.title 会更好 - 这些包括所有可见内容，你不会体验任何问题，无需重写整个<head> 内容。
感谢您的确认。我现在正在使用 BODY，但是我的外部链接没有加载到头部并导致问题，并且 CMS 在头部加载的外部资源也搞砸了。我可以接受您的评论作为答案吗？这个应该怎么回答？
【参考方案1】：
document.open("text/html", "replace");
document.write("<head></head><body>Testing</body>");
document.close();
【讨论】：
与document.documentElement.innerHTML 相比，此方法有一个额外的优势——它会再次触发body.onload 之类的所有事件。因此，在较新的浏览器上它也是一个更好的选择。【参考方案2】：
正如@duri 和我所确认的，documentElement (<html>) 对象以及一些其他特定的 HTML 元素在 Internet Explorer 中是只读的（参见第一条评论中的链接），因此替换了 @ 987654323@ 跨浏览器是不可能的。
使用javascript从head中剥离所有现有的link和script标签，然后设置body属性以匹配替换内容，然后替换body中的innerHTML，最后动态添加我自己的script、meta 和css 标签作为head 的子标签，实现了几乎相同的效果。
感谢@duri 提供解决方法提示！
【讨论】：
以上是关于在 Internet Explorer 中替换 document.documentElement.innerHTML的主要内容，如果未能解决你的问题，请参考以下文章
Xbox One Internet Explorer JavaScript 按键
选择框在 Internet Explorer 中不起作用/消失
javascript $(window).width() 属性在 Internet Explorer 中不起作用
Internet Explorer 11 和 jQuery UI
在同一台计算机上运行 Internet Explorer 6、Internet Explorer 7 和 Internet Explorer 8