Question

我在HTML页面上有2个DIV：

<div id="divDebug" />
<div id="divResult" />

我有一个脚本可以访问Web服务并用数据填充它们：

document.getElementById("divDebug").innerHtml = rawResult;
document.getElementById("divResult").innerHtml = processResult(rawResult);

这是我的问题：

以上代码在IE 8中运行良好
以上代码有时会有效，有时在Chrome 3中无效。
只有第一行在FF 3.51中有效。在使用FireBug进行测试后，我可以看到表达式document.getElementById("divResult")的计算结果为null。

经过多次反复试验，我发现如果我将HTML代码更改为：

<div id="divDebug"></div>
<div id="divResult"></div>

所有3种浏览器都能正常运行。

我的问题是：

为什么我必须关闭DIV才能使用它们？
这是一个JavaScript的东西，还是一个FF bug？
是否有任何其他HTML元素在未正确关闭时将无法使用？

谢谢！

Answer 1

基本上，

<div/>是关闭标签的XML方式。 <div></div>是HTML（和XML）。

您使用的是什么DOCTYPE？

来自C. HTML Compatibility Guidelines中的XHTML™ 1.0 The Extensible HyperText Markup Language (Second Edition)：

C.3。元素最小化和空元素内容

给定内容模型不是的元素的空实例   EMPTY（例如，空标题或   段）不要使用最小化   表单（例如使用<p> </p>而不是<p />）。

Answer 2

~~您使用的DOCTYPE是什么？ DOCTYPE定义浏览器应如何解释HTML。~~

浏览器使用Content-type标头来决定如何解析所服务的内容。如果content-type是text / html，它将被解析为HTML，如果内容类型是application / xhtml + xml，它将被解析为XHTML。 [感谢Miles进行更正。]

HTML4 spec requires that you close the DIV tag with proper end tag。有某些标签，例如img，br，meta，这可能是自我关闭的。

如果您使用的是XHTML，则可以self close the tag if it's empty otherwise closing tag is required。

另一个提示：始终根据您使用的DOCTYPE验证您的HTML / XHTML，您可以消除这些错误。

Answer 3

您正在编写非标准HTML。当你这样做时，浏览器可以并且将会有效地将你的HTML重写为有意义的东西。 IE8以一种方式重写了错误的自闭标签，FF选择了另一种，但重要的是两者都必须猜测。

正确的补救措施是遵循HTML standard，只允许您自我关闭少数元素：

<area />
<base />
<basefont />
<col />
<br />
<hr />
<input />
<img />
<link />
<meta />
<param />

Answer 4

良好的经验法则 - 如果您可以在HTML中省略结束标记，则可以在XHTML中自行关闭。示例：<img />和<hr />。否则，您需要明确关闭它。

单标记DIV的document.getElementById失败

4 个答案:

C.3。元素最小化和空元素内容