什么时候应该使用.innerHTML和JavaScript中的document.write

R_U*_*ser 11 javascript

是否有一般规则,何时应该使用document.write更改网站内容以及何时使用.innerHTML

到目前为止我的规则是:

1)添加新内容document.write时使用

2)更改现有内容.innerHTML时使用

但我感到困惑,因为有人告诉我,一方面.innerHTML是一个奇怪的微软标准,但另一方面我读到document.writeXHTML中不允许这样做.

我应该使用哪些结构来使用JavaScript操作我的源代码?

Tre*_*ris 12

innerHTML可用于通过字符串munging来更改DOM的内容.因此,如果您想在所选元素的末尾添加带有一些文本的段落,您可以这样

document.getElementById( 'some-id' ).innerHTML += '<p>here is some text</p>'

虽然我建议使用尽可能多的DOM操作特定的API尽可能(例如document.createElement,document.createDocumentFragment,<element>.appendChild等).但这只是我的偏好.

我见过适用的唯一一次document.write是在HTML5 Boilerplate中(看看它是如何检查jQuery是否正确加载).除此之外,我会远离它.


fca*_*ran 11

innerHTMLdocument.write不是真正可比的方法来动态改变/插入内容,因为它们的使用是不同的,不同的目的.

document.write应该与特定用例绑定.当页面已加载且DOM已准备好时,您将无法再使用该方法.这就是为什么通常最常用于条件语句,你可以使用它来同步加载外部javascript文件(javascript库),包括<script>块(例如当你从CDN加载jQuery时HTML5 Boilerplate).

当页面与application/xhtml+xmlmime类型一起提供时,您读到的关于此方法和XHTML的内容是正确的:来自w3.org

document.write(如document.writeln)在XHTML文档中不起作用(错误控制台上会出现"操作不受支持"(NS_ERROR_DOM_NOT_SUPPORTED_ERR)错误).如果打开具有.xhtml文件扩展名的本地文件或使用application/xhtml + xml MIME类型提供的任何文档,则会出现这种情况

这些方法之间的另一个区别与插入节点有关:当您使用.innerHTML方法时,您可以选择附加内容的位置,而使用document.write时,插入节点始终是使用此方法的文档的一部分.