为什么这个JavaScript（使用document.open和document.write）不能在Internet Explorer或Opera中运行？ [英] Why won't this JavaScript (using document.open and document.write) work in Internet Explorer or Opera?

查看：136
本文介绍了为什么这个JavaScript（使用document.open和document.write）不能在Internet Explorer或Opera中运行？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我迫切需要一些帮助。

我创建了一个< script>这与另一个更复杂的< script>的问题紧密相关，并且再现了这个问题。我在其他地方写过。

I've created a <script> that closely parallels, and reproduces the problem of, another more complex <script> that I've written elsewhere.

这是它的作用：


  • 创建一个< iframe>并插入< div>在页面上

  • 创建并将文档附加到该< iframe>，其中包含< script>它定义了一些函数（包括一个回调函数和一个使用AJAX加载外部<脚本>的函数）

  • 后一个外部脚本只是对回调函数的调用，它调用了一个创建文档并将其附加到< iframe>的函数在里面;这应该有效地覆盖< script>

涉及的三个文件是：

  • http://troy.onespot.com/static/document_write/index.html (the main page)
  • http://troy.onespot.com/static/document_write/main.js (the first <script> that's loaded)
  • http://troy.onespot.com/static/document_write/jsonp.js (the <script> loaded by jQuery's $.ajax() method)

这一切都适用于Firefox，Safari和Chrome。它崩溃的地方是Internet Explorer和Opera。会发生什么是main.js中的render（）函数执行，并且触发了所有三个警报，但是< iframe>中的文档被触发了。没有被覆盖。我无法分辨正在创建或写入的文档，或者根本不知道。

This all works in Firefox, Safari, and Chrome. Where it breaks down is in Internet Explorer and Opera. What happens is that the render() function in main.js executes, and all three alerts are fired, but the document in the <iframe> is not overwritten. I can't tell what document is being created or written to, or if one is at all.

如果我添加调试代码（如console.log（document））在render（）函数的开头，工作浏览器似乎可以处理现有的< iframe>记录并列出下面包含的属性。 Internet Explorer似乎也可以找到某种文档。我只是不知道为什么不让我覆盖它。

If I add debug code (like console.log(document)) in the beginning of the render() function, the working browsers seem to get a handle on the existing <iframe> document and list the properties included below. Internet Explorer also appears to find a document of some sort. I just can't tell why it's not letting me overwrite it.

这可能是范围问题吗？也许我不正确地使用document.write（），document.open（）或document.close（）方法，而Firefox和其他一些浏览器只是让我逃脱它？

Could it be an issue of scope? Maybe I'm using the document.write(), document.open() or document.close() methods improperly, and Firefox and a few other browsers are just letting me get away with it?

一个可能的线索：如果我把render（）函数的内容拿出来（即，只是把它们放在main.js中的load（）之后），这样可以正常工作。这告诉我，我不是如何使用document.open（）等，但是在执行callback（）函数时，文档对象不可用，或者超出了范围，或类似的东西。

One possible clue: if I take the guts of the render() function out (i.e., just put them after load() in main.js), this works fine. That suggests to me that it's not how I'm using document.open(), etc., but that somehow by the time that the callback() function is executed, the document object is not available, or has gone out of scope, or something like that.

这让我完全难过，这是一个非常重要的项目，即将到期。如果它让我摆脱了这个堵塞，我不会超越黑客或解决方法。任何帮助或见解都将非常感激！

This has me totally stumped, and it's for a very important project with an impending deadline. I'm not above a hack or workaround if it gets me out of this jam. Any help or insight would be EXTREMELY appreciated!

console.log（）的文档属性列表：

console.log()'s listing of the document properties:

ATTRIBUTE_NODE: 2
CDATA_SECTION_NODE: 4
COMMENT_NODE: 8
DOCUMENT_FRAGMENT_NODE: 11
DOCUMENT_NODE: 9
DOCUMENT_POSITION_CONTAINED_BY: 16
DOCUMENT_POSITION_CONTAINS: 8
DOCUMENT_POSITION_DISCONNECTED: 1
DOCUMENT_POSITION_FOLLOWING: 4
DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: 32
DOCUMENT_POSITION_PRECEDING: 2
DOCUMENT_TYPE_NODE: 10
ELEMENT_NODE: 1
ENTITY_NODE: 6
ENTITY_REFERENCE_NODE: 5
NOTATION_NODE: 12
PROCESSING_INSTRUCTION_NODE: 7
TEXT_NODE: 3
URL: "http://localhost/projects/test/ajax_loader/document_write/index.html"
activeElement: HTMLBodyElement
addEventListener: function addEventListener() {
adoptNode: function adoptNode() {
alinkColor: ""
all: HTMLCollection
anchors: HTMLCollection
appendChild: function appendChild() {
applets: HTMLCollection
attributes: null
baseURI: "http://localhost/projects/test/ajax_loader/document_write/index.html"
bgColor: ""
body: HTMLBodyElement
captureEvents: function captureEvents() {
characterSet: "UTF-8"
charset: "UTF-8"
childNodes: NodeList
clear: function clear() {
cloneNode: function cloneNode() {
close: function close() {
compareDocumentPosition: function compareDocumentPosition() {
compatMode: "BackCompat"
cookie: "__gads=ID=62bb88ab20ac9451:T=1256683145:S=ALNI_Mbso-nFjAvRzYhCSwhiuaDh84G8CA"
createAttribute: function createAttribute() {
createAttributeNS: function createAttributeNS() {
createCDATASection: function createCDATASection() {
createComment: function createComment() {
createDocumentFragment: function createDocumentFragment() {
createElement: function createElement() {
createElementNS: function createElementNS() {
createEntityReference: function createEntityReference() {
createEvent: function createEvent() {
createExpression: function createExpression() {
createNSResolver: function createNSResolver() {
createNodeIterator: function createNodeIterator() {
createProcessingInstruction: function createProcessingInstruction() {
createRange: function createRange() {
createTextNode: function createTextNode() {
createTreeWalker: function createTreeWalker() {
defaultCharset: "iso-8859-1"
defaultView: DOMWindow
designMode: "off"
dir: ""
dispatchEvent: function dispatchEvent() {
doctype: null
documentElement: HTMLHtmlElement
documentURI: "http://localhost/projects/test/ajax_loader/document_write/index.html"
domain: "localhost"
elementFromPoint: function elementFromPoint() {
embeds: HTMLCollection
evaluate: function evaluate() {
execCommand: function execCommand() {
fgColor: ""
firstChild: HTMLHtmlElement
forms: HTMLCollection
getCSSCanvasContext: function getCSSCanvasContext() {
getElementById: function getElementById() {
getElementsByClassName: function getElementsByClassName() {
getElementsByName: function getElementsByName() {
getElementsByTagName: function getElementsByTagName() {
getElementsByTagNameNS: function getElementsByTagNameNS() {
getOverrideStyle: function getOverrideStyle() {
getSelection: function getSelection() {
hasAttributes: function hasAttributes() {
hasChildNodes: function hasChildNodes() {
hasFocus: function hasFocus() {
height: 150
images: HTMLCollection
implementation: DOMImplementation
importNode: function importNode() {
inputEncoding: "UTF-8"
insertBefore: function insertBefore() {
isDefaultNamespace: function isDefaultNamespace() {
isEqualNode: function isEqualNode() {
isSameNode: function isSameNode() {
isSupported: function isSupported() {
jQuery1258269389622: 2
lastChild: HTMLHtmlElement
lastModified: ""
linkColor: ""
links: HTMLCollection
localName: null
location: Location
lookupNamespaceURI: function lookupNamespaceURI() {
lookupPrefix: function lookupPrefix() {
namespaceURI: null
nextSibling: null
nodeName: "#document"
nodeType: 9
nodeValue: null
normalize: function normalize() {
open: function open() {
ownerDocument: null
parentElement: null
parentNode: null
plugins: HTMLCollection
preferredStylesheetSet: null
prefix: null
previousSibling: null
queryCommandEnabled: function queryCommandEnabled() {
queryCommandIndeterm: function queryCommandIndeterm() {
queryCommandState: function queryCommandState() {
queryCommandSupported: function queryCommandSupported() {
queryCommandValue: function queryCommandValue() {
querySelector: function querySelector() {
querySelectorAll: function querySelectorAll() {
readyState: "complete"
referrer: "http://localhost/projects/test/ajax_loader/document_write/index.html"
releaseEvents: function releaseEvents() {
removeChild: function removeChild() {
removeEventListener: function removeEventListener() {
replaceChild: function replaceChild() {
scripts: HTMLCollection
selectedStylesheetSet: null
styleSheets: StyleSheetList
textContent: null
title: " Page"
vlinkColor: ""
width: 300
write: function write() {
writeln: function writeln() {
xmlEncoding: null
xmlStandalone: false
xmlVersion: null


推荐答案


如果我把render（）函数的内容拿出来（也就是说，只需将它们放在main.js中的load（）之后），这样就可以了。

if I take the guts of the render() function out (i.e., just put them after load() in main.js), this works fine.

在IE8中不适合我。如果我完全丢失了AJAX调用并且只在main.js中调用 render（），我会得到相同的结果。事实上即使我用以下内容替换整个main.js：

Doesn't for me in IE8. If I lose the AJAX call completely and just call render() in main.js, I get the same result. In fact even if I replace the whole of main.js with just:

document.write('hello!');

无论是否打开文件，都不会出现问候！

with or without opening the document, the hello never appears!

如果我在main.js中对 render 的调用设置任何超时（甚至0），它就可以工作。另一方面，父文档的超时似乎没有做任何事情。

If I put any timeout (even 0) on the call to render in main.js, it works. The timeout on the parent document, on the other hand, doesn't seem to be doing anything.

这种极端怪异是由jQuery使用临时插入的<$引起的c $ c>< script> 标记用于执行jsonp.js中返回的代码。如果你只是在返回值上调用 eval 而不是让jQuery执行它，它就可以正常工作。

This extreme weirdness is caused by jQuery using a temporarily-inserted <script> tag to execute the code returned by in jsonp.js. If you simply call eval on the return value instead of having jQuery execute it, it works fine.

相关的问题我发现缩小你好的例子由index.html证明：

A related problem I found narrowing down the hello example is demonstrated by index.html:

<body>
<iframe name="foo"></iframe>
<script>
    var idoc= frames['foo'].document;
    idoc.open();
    idoc.write('<body><script src="main.js"><\/script>');
    idoc.close();
</script>

main.js包含：

with main.js containing:

document.write('foo');

没有写过foo。 （另一方面，内联脚本没问题。）

There is no foo written. (An inline script, on the other hand, was fine.)

如果省略 idoc.close ，有效。如果添加了额外的 idoc.write（'bar'），则栏是在仅限IE中的foo 。如果我添加 bar 和关闭调用，则IE崩溃。

If the idoc.close was omitted, it worked. If an additional idoc.write('bar') was added, the bar was written before foo in IE only. If I added both bar and the close call, IE crashed.

总而言之，深层问题使用 document.write 来自文件内部，该文件本身由文件撰写！尽可能避免使用它。 document.open 可以是从父文档填充iframe的有用方法，但您不应该在子文档中真正需要它，在那里您可以使用DOM方法在你自己身上。

So to summarise, there are deep problems using document.write from inside a document that was itself written by document.write! Try to avoid it if at all possible. document.open can be a useful way to populate an iframe from a parent document, but you shouldn't really be needing it inside the child document, where you can use DOM methods on yourself.

这篇关于为什么这个JavaScript（使用document.open和document.write）不能在Internet Explorer或Opera中运行？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆