什么是HTML不关闭标签和属性的实际问题 [英] What are the actual problems of not closing tags and attributes in HTML
问题描述
最近朋友决定不关闭他的标签或HTML属性，因为它不是必需的，他会节省一些带宽和下载时间。我告诉他，这是一个坏主意，要防患于未然，然而，我只能找到真正的问题2资源：
Recently a friend decided not to close his tags or attributes in HTML because it's not required and he'll save some bandwidth and download time. I told him it's a bad idea and to be "better safe than sorry", however, I could only really find 2 resources on the issue:
- http://css-tricks.com/13286-problems-with-unquoted-attributes/
- http://www.cs.tut.fi/~jkorpela/qattr.html
- http://css-tricks.com/13286-problems-with-unquoted-attributes/
- http://www.cs.tut.fi/~jkorpela/qattr.html
1是好的，但即使如他所说，他们是不是真的现实世界的例子，这就是为什么我去＃2，但他们才真正显示出＆LT; A＆GT; ，它比大多数其他标签/节点更加不同。
#1 is good, but even as he said, they aren't really real world examples, which is why I went to #2, but they only really show an <a> which is much more different than most other tags/nodes.
有另一种资源或测试用例到一个更好的理由来引用您的属性，并关闭标签？
Is there another resource or test cases as to a better reasons to quote your attributes and close your tags?
推荐答案
您可以经常请假的结束标记了在不改变它的样子的元素。然而，即使HTML5的主要目标之一是标准化浏览器如何处理不良标记，不关闭标签可以以意想不到的方式影响您的内容。这里有一个简单的例子，项目里的一些项目都是空白，既没有明确关闭的标签和使用的列表：
You can often leave the closing tags off many elements without changing 'the way it looks'. However, even though one of the main goals of HTML5 is to standardize how browsers deal with bad markup, not closing tags can impact your content in unexpected ways. Here's a simple example, a list of items where some of the items are blank, both without explicitly closed tags and with:
<ul>
<li>Item
<li>
<li>Item
<li>
<li>Item
</ul>
<ul>
<li>Item</li>
<li></li>
<li>Item</li>
<li></li>
<li>Item</li>
</ul>
在浏览器中两个展望他们看起来完全相同。但是，如果添加了CSS的隐藏空的：
Looking at the two in a browser they look identical. However, if you add a bit of CSS to hide the empty ones:
li:empty { display: none; }
现在他们不看一样，即使标记没有从$ P $改变pvious例子。这种情况的根本原因在于，这两个版本通过所有节点产生不同的DOM树，这个版本迭代的在两个列表和计数它们，然后示出了结果，并在警报发现节点的列表。你可以看到顶部的列表中有12 DOM节点，下面的列表中有15的结果是至少有一致的跨浏览器，不同的是在脚本无论如何，当你经常跳过文本节点，但是这表明即使可视化输出的外观相同，当标签被关闭或没有，甚至还有在这样简单的例子根本的区别。
Now they don't look the same, even though the markup hasn't changed from the previous example. The underlying reason for this is that the two versions produce different DOM trees, this version iterates through all the nodes in both lists and counts them, then shows the results and the list of nodes found in alerts. You can see the top list has 12 DOM nodes, the lower list has 15. The results are at least consistent cross browser, and the difference is in text nodes which you'll frequently skip over when scripting anyway, but this shows that even if the visual output looks the same when tags are closed or not, there are underlying differences even in an example as simple as this.
这篇关于什么是HTML不关闭标签和属性的实际问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
