Html 有必要写HEAD、BODY和HTML标签吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5641997/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is it necessary to write HEAD, BODY and HTML tags?
提问by Larry Cinnabar
Is it necessary to write <html>, <head>and <body>tags?
是否有必要写<html>,<head>和<body>标签？
For example, I can make such a page:
例如，我可以制作这样一个页面：
<!DOCTYPE html>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Page Title</title>
<link rel="stylesheet" type="text/css" href="css/reset.css">
<script src="js/head_script.js"></script><!-- this script will be in head //-->
<div>Some html</div> <!-- here body starts //-->
<script src="js/body_script.js"></script>
And Firebug correctly separates head and body:
Firebug 正确地将头部和身体分开：
W3C Validation says it's valid.
W3C 验证说它是有效的。
But I rarely see this practice on the web.
但是我很少在网上看到这种做法。
Are there any reason to write these tags?
有什么理由写这些标签吗？
采纳答案by Alohci
Omitting the html, head, and bodytagsis certainly allowed by the HTML specs. The underlying reason is that browsers have always sought to be consistent with existing web pages, and the very early versions of HTML didn't define those elements. When HTML 2.0first did, it was done in a way that the tags would be inferred when missing.
省略html，head和body标签肯定是由HTML规范允许的。根本原因是浏览器一直寻求与现有网页保持一致，而 HTML 的早期版本并没有定义这些元素。当 HTML2.0首先是这样做的，它是在标签丢失时推断出来的。
I often find it convenient to omit the tags when prototyping and especially when writing test cases as it helps keep the mark-up focused on the test in question. The inference process shouldcreate the elements in exactly the manner that you see in Firebug, and browsers are pretty consistent in doing that.
我经常发现在原型设计时省略标签很方便，尤其是在编写测试用例时，因为它有助于将标记集中在有问题的测试上。推理过程应该完全按照您在 Firebug 中看到的方式创建元素，并且浏览器在这方面非常一致。
But...
但...
IE has at least one known bug in this area. Even IE9 exhibits this. Suppose the markup is this:
IE 在这方面至少有一个已知的错误。甚至 IE9 也展示了这一点。假设标记是这样的：
<!DOCTYPE html>
<title>Test case</title>
<form action='#'>
<input name="var1">
</form>
You should (and do in other browsers) get a DOM that looks like this:
您应该（并且在其他浏览器中这样做）获得如下所示的 DOM：
HTML
HEAD
TITLE
BODY
FORM action="#"
INPUT name="var1"
But in IE you get this:
但是在 IE 中你会得到这个：
HTML
HEAD
TITLE
FORM action="#"
BODY
INPUT name="var1"
BODY
This bug seems limited to the formstart tag preceding any text content and any bodystart tag.
这个错误似乎仅限于form任何文本内容之前的开始标签和任何body开始标签。
回答by Rima
The Google Style Guide for HTML recommends omitting all optional tags.
That includes <html>, <head>, <body>, <p>and <li>.
Google HTML 样式指南建议省略所有可选标签。
这包括 <html>，<head>，<body>，<p>和<li>。
https://google.github.io/styleguide/htmlcssguide.html#Optional_Tags
https://google.github.io/styleguide/htmlcssguide.html#Optional_Tags
For file size optimization and scannability purposes, consider omitting optional tags. The HTML5 specification defines what tags can be omitted.
(This approach may require a grace period to be established as a wider guideline as it's significantly different from what web developers are typically taught. For consistency and simplicity reasons it's best served omitting all optional tags, not just a selection.)
<!-- Not recommended --> <!DOCTYPE html> <html> <head> <title>Spending money, spending bytes</title> </head> <body> <p>Sic.</p> </body> </html> <!-- Recommended --> <!DOCTYPE html> <title>Saving money, saving bytes</title> <p>Qed.
出于文件大小优化和可扫描性的目的，请考虑省略可选标签。HTML5 规范定义了可以省略哪些标签。
（这种方法可能需要建立一个宽限期作为更广泛的指导方针，因为它与 Web 开发人员通常所学的有很大不同。出于一致性和简单性的原因，最好省略所有可选标签，而不仅仅是选择。）
<!-- Not recommended --> <!DOCTYPE html> <html> <head> <title>Spending money, spending bytes</title> </head> <body> <p>Sic.</p> </body> </html> <!-- Recommended --> <!DOCTYPE html> <title>Saving money, saving bytes</title> <p>Qed.
回答by Ian Clelland
Contrary to @Liza Daly's note about HTML5, that spec is actually quite specific about which tags can be omitted, and when (and the rules are a bit different from HTML 4.01, mostly to clarify where ambiguous elements like comments and whitespace belong)
与@Liza Daly 关于 HTML5 的说明相反，该规范实际上非常具体地说明了哪些标签可以省略以及何时可以省略（并且规则与 HTML 4.01 略有不同，主要是为了澄清诸如注释和空格之类的模糊元素所属的位置）
The relevant reference is http://www.w3.org/TR/2011/WD-html5-20110525/syntax.html#optional-tags, and it says:
相关参考是http://www.w3.org/TR/2011/WD-html5-20110525/syntax.html#optional-tags，它说：
An html element's start tag may be omitted if the first thing inside the html element is not a comment.
An html element's end tag may be omitted if the html element is not immediately followed by a comment.
A head element's start tag may be omitted if the element is empty, or if the first thing inside the head element is an element.
A head element's end tag may be omitted if the head element is not immediately followed by a space character or a comment.
A body element's start tag may be omitted if the element is empty, or if the first thing inside the body element is not a space character or a comment, except if the first thing inside the body element is a script or style element.
A body element's end tag may be omitted if the body element is not immediately followed by a comment.
如果 html 元素中的第一件事不是注释，则可以省略 html 元素的开始标记。
如果 html 元素后面没有紧跟注释，则可以省略 html 元素的结束标记。
如果元素为空，或者 head 元素中的第一个元素是一个元素，则可以省略 head 元素的开始标记。
如果 head 元素后面没有紧跟空格字符或注释，则可以省略 head 元素的结束标记。
如果 body 元素为空，或者 body 元素中的第一个元素不是空格字符或注释，则可以省略 body 元素的开始标记，除非 body 元素中的第一个元素是脚本或样式元素。
如果 body 元素后面没有紧跟注释，则可以省略 body 元素的结束标记。
So your example is valid HTML5, and would be parsed like this, with the html, head and body tags in their implied positions:
所以你的例子是有效的 HTML5，并且会像这样解析，html、head 和 body 标签在它们的隐含位置：
<!DOCTYPE html><HTML><HEAD>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Page Title</title>
<link rel="stylesheet" type="text/css" href="css/reset.css">
<script src="js/head_script.js"></script></HEAD><BODY><!-- this script will be in head //-->
<div>Some html</div> <!-- here body starts //-->
<script src="js/body_script.js"></script></BODY></HTML>
Note that the comment "this script will be in head" is actually parsed as part of the body, although the script itself is part of the head. According to the spec, if you want that to be different at all, then the </HEAD>and <BODY>tags may not be omitted. (Although the corresponding <HEAD>and </BODY>tags still can be)
请注意，注释“此脚本将在头部”实际上被解析为正文的一部分，尽管脚本本身是头部的一部分。根据规范，如果您希望它完全不同，则不能省略</HEAD>and<BODY>标签。（虽然对应的<HEAD>和</BODY>标签还是可以的）
回答by Liza Daly
It's valid to omit them in HTML4:
在 HTML4 中省略它们是有效的：
7.3 The HTML element
start tag: optional, End tag: optional
7.4.1 The HEAD element
start tag: optional, End tag: optional
http://www.w3.org/TR/html401/struct/global.html
http://www.w3.org/TR/html401/struct/global.html
In HTML5, there are no "required" or "optional" elements exactly, as HTML5 syntax is more loosely defined. For example, title:
在 HTML5 中，完全没有“必需”或“可选”元素，因为 HTML5 语法的定义更为松散。例如title：
The title element is a required child in most situations, but when a higher-level protocol provides title information, e.g. in the Subject line of an e-mail when HTML is used as an e-mail authoring format, the title element can be omitted.
在大多数情况下，标题元素是必需的子元素，但是当更高级别的协议提供标题信息时，例如在电子邮件的主题行中，当 HTML 用作电子邮件创作格式时，标题元素可以省略.
http://www.w3.org/TR/html5/semantics.html#the-title-element-0
http://www.w3.org/TR/html5/semantics.html#the-title-element-0
It's not valid to omit them in true XHTML5, though that is almost never used (versus XHTML-acting-like-HTML5).
在真正的 XHTML5 中省略它们是无效的，尽管这几乎从未使用过（相对于 XHTML-acting-like-HTML5）。
However, from a practical standpoint you often want browsers to run in "standards mode," for predictability in rendering HTML and CSS. Providing a DOCTYPE and a more structured HTML tree will guarantee more predictable cross-browser results.
但是，从实际的角度来看，您通常希望浏览器以“标准模式”运行，以便在呈现 HTML 和 CSS 时具有可预测性。提供 DOCTYPE 和更结构化的 HTML 树将保证更可预测的跨浏览器结果。
回答by Peter Bagnall
It's true that the HTML specs permit certain tags to be omitted in certain cases, but generally doing so is unwise.
HTML 规范确实允许在某些情况下省略某些标签，但通常这样做是不明智的。
It has two effects - it makes the spec more complex, which in turn makes it harder for browser authors to write correct implementations (as demonstrated by IE getting it wrong).
它有两个影响——它使规范更加复杂，这反过来又使浏览器作者更难编写正确的实现（如 IE 出错所证明的那样）。
This makes the likelihood of browser errors in these parts of the spec high. As a website author you can avoid the issue by including these tags - so while the spec doesn't say you have to, doing so reduces the chance of things going wrong, which is good engineering practice.
这使得规范的这些部分出现浏览器错误的可能性很高。作为网站作者，您可以通过包含这些标签来避免该问题 - 因此，虽然规范没有规定您必须这样做，但这样做可以减少出现问题的机会，这是良好的工程实践。
What's more, the latest HTML 5.1 WG spec currently says (bear in mind it's a work in progress and may yet change).
更重要的是，最新的 HTML 5.1 WG 规范目前说（请记住，这是一项正在进行的工作，可能还会改变）。
A body element's start tag may be omitted if the element is empty, or if the first thing inside the body element is not a space character or a comment, except if the first thing inside the body element is a meta, link, script, style, or template element.
如果 body 元素为空，或者 body 元素内的第一件事不是空格字符或注释，则可以省略 body 元素的开始标记，除非 body 元素内的第一件事是元、链接、脚本、样式, 或模板元素。
http://www.w3.org/html/wg/drafts/html/master/sections.html#the-body-element
http://www.w3.org/html/wg/drafts/html/master/sections.html#the-body-element
This is a little subtle. You can omit body and head, and the browser will then infer where those elements should be inserted. This carries the risk of not being explicit, which could cause confusion.
这有点微妙。您可以省略 body 和 head，然后浏览器将推断这些元素应该插入的位置。这带来了不明确的风险，这可能会导致混淆。
So this
所以这
<html>
<h1>hello</h1>
<script ... >
...
results in the script element being a child of the body element, but this
导致 script 元素成为 body 元素的子元素，但是这
<html>
<script ... >
<h1>hello</h1>
would result in the script tag being a child of the head element.
将导致 script 标签成为 head 元素的子元素。
You could be explicit by doing this
你可以通过这样做来明确
<html>
<body>
<script ... >
<h1>hello</h1>
and then whichever you have first, the script or the h1, they will both, predictably appear in the body element. These are things which are easy to overlook while refactoring and debugging code. (say for example, you have JS which is looking for the 1st script element in the body - in the second snippet it would stop working).
然后，无论您先拥有脚本还是 h1，它们都会以可预见的方式出现在 body 元素中。这些是在重构和调试代码时很容易忽略的事情。（例如，您有 JS 正在寻找正文中的第一个脚本元素 - 在第二个片段中它将停止工作）。
As a general rule, being explicit about things is always better than leaving things open to interpretation. In this regard XHTML is better because it forces you to be completely explicit about your element structure in your code, which makes it simpler, and therefore less prone to misinterpretation.
作为一般规则，对事情明确总是比让事情有待解释要好。在这方面，XHTML 更好，因为它强制您完全明确代码中的元素结构，这使得它更简单，因此更不容易被误解。
So yes, you can omit them and be technically valid, but it is generally unwise to do so.
所以是的，你可以省略它们并且在技术上是有效的，但这样做通常是不明智的。
回答by halfdan
Firebug shows this correctly because your Browser automagically fixes the bad markup for you. This behaviour is not specified anywhere and can (will) vary from browser to browser. Those tags are required by the DOCTYPE you're using and should not be omitted.
Firebug 正确显示了这一点，因为您的浏览器会自动为您修复错误的标记。此行为未在任何地方指定，并且可能（将）因浏览器而异。这些标签是您使用的 DOCTYPE 所必需的，不应省略。
The html elementis the root element of every html page. If you look at all other elements' description it says where an element can be used (and almost all elements require either head or body).
该html元素是每一个HTML页面的根元素。如果您查看所有其他元素的描述，它会说明可以在哪里使用元素（并且几乎所有元素都需要头部或主体）。
