Javascript lastChild 调用在使用空元素标签时返回同级

Question

我有以下一段 Javascript:

//Clear out container
var container = document.getElementById("buy");
while (container.lastChild)
{
    container.removeChild(container.lastChild);
}

再往下，它运行的 HTML 片段:

<div id="buy" class="itemGroup" />

<canvas id="drawArea" width="200" height="200">
    Your browser does not support HTML5 Canvas.
</canvas>   

但是，Javascript 代码会删除 Canvas ，除非 buy div 使用开始和结束标签，即

<div id="buy" class="itemGroup">
</div>

这是为什么？我认为从 XML 的 Angular 来看，这两者是等价的？在 Windows 7 上使用 Chrome 29.0.1547.76 m。

提前致谢!

Answer 1

这不是比已经给出的评论本身更完整的答案，但我无法在您的帖子中添加评论。不管怎样，有些标签不会自动关闭，“div”就是其中之一——如果你仔细想想，这实际上是有道理的。从语义上讲，如果里面什么都没有，你为什么要进行“除法”？

另一个棘手的问题是“脚本”。即使您链接到页面中的外部脚本文件，您也不能使用

<script type="text/javascript" src="example.js" />

这根本行不通。另一个是“文本区域”。这会使任何 html 都变得毫无用处!

<textarea cols="5" rows="5" />

看看其他一些:http://xahlee.info/js/html5_non-closing_tag.html