Question

我正在测试一些JavaScript代码，并意识到这段代码......

var msg = "Hello, World!";
document.open();
document.write(msg);
document.close();

...与此结果相同：

var msg = "Hello, World!";
document.write(msg);

有什么区别？

Answer 1

在正式规范之前建立了围绕 document.write 的许多行为，因此行为不一致，并且在浏览器中有些随意。但是，行为现在相当一致，但根据调用的时间有所不同。

基本上不鼓励使用 document.write ，但它仍然有用。它无处不在的支持意味着如果需要适应旧的浏览器，它可以用作其他技术的替代品。

正在加载文档

如果在加载文档时使用 document.write （例如文档源中的脚本元素），则无需调用open或close。导航到文档时打开文档，当内容加载完成时（即发生加载事件时）关闭文档。因此，只要在 load 发生之前执行所有写语句，浏览器就会完成其余的工作。

在窗口加载事件后调度

文档加载完毕后（例如已调度 load 事件），然后调用 document.write 将首先调用 clear 这将清除文档的整个内容，一切。在这种情况下，当对 write 的调用结束时，并非所有浏览器都会自动调用 close 。

有些浏览器会猜测并且似乎稍后会调用 close （IE？），其他浏览器（Firefox，Safari）会使文档保持打开状态，这可能会导致一些异常行为。

子窗口

如果您打开子窗口，例如使用 window.open ，然后从父级写入它，写入将在页面加载完成后发生，因此它将清除文档。 e.g。

function openWindow() {
  var win = window.open('http://www.google.com','','')
  win.document.write(
    '<!doctype html><title>foo</title><div>Here is a div</div>'
  )
  win.document.close();
}

在这种情况下，您永远不会看到Google，对 write 的调用会在加载并写入新内容时清除页面。

此外，浏览器不会自动调用 close ，您可以对 document.write 进行后续调用，它们将附加到现有标记，例如

// Global
var win;

// Open new window and write to it, don't close    
function openWindow() {
  win = window.open('http://www.google.com','','')

  win.document.write(
    '<!doctype html><title>foo</title><div>Here is a div</div>'
  )
}

// Call some time later, content will be appended    
function writeToWindow(){
  win.document.write(
    '<div>Here is the second div</div>'
  )
}

您可能会在标签页或窗口上看到一些动画，表明它仍在加载。

如果，在上面， openWindow 在结束之前调用 document.close ，那么随后对 writeToWindow 的调用将首先清除文档， div是文档中唯一的元素（以及浏览器自动添加的强制性HTML，HEAD和BODY元素，可能还有通过纠错添加的TITLE）。

因此，在这种情况下，您应该在适当的位置调用 close 。

OP

如果在加载期间调用以下内容，则：

var msg = "Hello, World!";

// The following has no effect as the document is currently
// loading, therefore already open
document.open();

// Writes to the document
document.write(msg);

// The following has no effect because the window hasn't fired load yet
document.close();

因此，在这种情况下，只有 document.write 行才有用。

一些播放代码：

var win;

function openWindow() {
  win = window.open('http://www.google.com','','')
  win.document.write(
    '<!doctype html><title>foo</title><div>Here is a div</div>'
  )
  win.document.close();
}

function writeToWindow(){
  win.document.write(
    '<div>Here is the second div</div>'
  )
}

Answer 2

open()和write()之间的区别在于open()会清除文档，以便您可以写入文档。 write()实际上将内容放入文档中。

无需明确调用document.open() / document.close()，因为document.write()在页面加载时隐式处理open()，在完成时隐式处理close()。

阅读documentation here

Answer 3

document.open

这是一个小提琴示例http://jsfiddle.net/8stv489e/

使用此代码

var msg = "Hello, World! first";
document.write(msg);

var msg = "Hello, World! second";
document.open();
document.write(msg);
document.close();

正如您在小提琴中看到的那样，在open().

上重新初始化文档时，文档内容会被覆盖

阅读此https://developer.mozilla.org/en-US/docs/Web/API/document.open

document.close

而document.close不需要在任何地方进行。{ document.write自动关闭流

修改
     如果写，
document.write不一定总是关闭文档   在文档加载完成后调用（Firefox for   例）。在那种情况下（例如写入使用的子窗口打开）   window.open），总是在关闭时调用是一个很好的预防措施   完成写作。   贡献@RobG

document.open和document.close是否必要？

3 个答案:

正在加载文档

在窗口加载事件后调度

子窗口

OP