是否有必要编写HEAD,BODY和HTML标签？
是否有必要写<html>,<head>和<body>标签？
例如,我可以制作这样一个页面:
<!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>
Firebug正确分离头部和身体:
W3C验证表明它是有效的.
但我很少在网上看到这种做法.
有没有理由写这些标签？
Alo*_*hci 140
省略html,head和body 标签肯定是由HTML规范允许的.根本原因是浏览器总是试图与现有网页保持一致,而HTML的早期版本并没有定义这些元素.当HTML2.0 首先,它是以错过时推断出标签的方式完成的.
我经常发现在原型设计时省略标签很方便,特别是在编写测试用例时,因为它有助于将标记集中在有问题的测试上.推理过程应该以您在Firebug中看到的方式完全创建元素,并且浏览器在执行此操作时非常一致.
但...
IE在这个领域至少有一个已知的bug.甚至IE9也展示了这一点.假设标记是这样的:
<!DOCTYPE html>
<title>Test case</title>
<form action='#'>
<input name="var1">
</form>
你应该(并在其他浏览器中)获得一个如下所示的DOM:
HTML
HEAD
TITLE
BODY
FORM action="#"
INPUT name="var1"
但在IE中你得到这个:
HTML
HEAD
TITLE
FORM action="#"
BODY
INPUT name="var1"
BODY
此错误似乎仅限于form任何文本内容和任何body开始标记之前的开始标记.
- HTML 1.0定义了HTML,HEAD和BODY:http://www.w3.org/MarkUp/draft-ietf-iiir-html-01.txt (5认同)
- @Liza - 这个文档是否定义了HTML 1.0,这是有争议的,但我认为,这些元素早于HTML 2.0.谢谢.然而,看到http://www.w3.org/History/19921103-hypertext/hypertext/WWW/MarkUp/Tags.html从1992年的元素不存在,那么. (5认同)
- @Justin这个答案似乎有一个线索,因为问题是"是否有必要编写HEAD,BODY和HTML标签？" 而不是它是否是一个好习惯.公约往往会改变......只需看看谷歌样式指南......这是一个约定,声明你*应该*省略这些标签...... :-) (3认同)
- @Justin - 这些限制主要是技术性的，通常不会影响您。所以是的，如果评论节点或空格出现在 head 元素之前或内部是否对您的页面很重要（页面的 JS *可能* 依赖于它），那么您必须明确标识 head start 标记以使其成为关系正确。但是如果没有，（而且我从来没有写过一个 HTML 页面），那么 head 标签将被推断在某个合理的地方，你可以安全地省略它。对于其他 html、head 和 body 标签也是如此。 (2认同)
Rim*_*ima 70
适用于HTML的Google样式指南建议省略所有可选标记.
这包括 <html>,<head>,<body>,<p>和<li>.
https://google.github.io/styleguide/htmlcssguide.html#Optional_Tags
对于文件大小优化和可扫描性目的,请考虑省略可选标记.HTML5规范定义了可以省略的标记.
(这种方法可能需要建立宽限期作为更广泛的指导,因为它与Web开发人员通常教授的内容明显不同.出于一致性和简单性的原因,最好省略所有可选标签,而不仅仅是选择.)
Run Code Online (Sandbox Code Playgroud)<!-- 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.
- 省略所有可能的标签是便士和愚蠢的.带宽节省很小(特别是因为大多数连接自动压缩),而边缘情况下人为错误的几率很高(考虑作者,编辑甚至HTML解析器编写者).找到错误也更难(因为熵的变化). (5认同)
- 不兼容的示例：我用于Web开发（实时）的实时重新加载工具会自动在头中插入脚本。最后没有<head>标记，它将无法正常工作。 (2认同)
- 有趣的是，goiogle.com 违反了 Google 风格指南，因为它有 <html>。 (2认同)
Ian*_*and 46
与@Liza Daly关于HTML5的说明相反,该规范实际上非常具体,可以省略哪些标签,以及何时(和规则有点不同于HTML 4.01,主要是为了澄清注释和空白等模糊元素所属的位置)
相关的参考是http://www.w3.org/TR/2011/WD-html5-20110525/syntax.html#optional-tags,并说:
如果html元素中的第一个内容不是注释,则可以省略html元素的开始标记.
如果html元素后面没有注释,则可以省略html元素的结束标记.
如果元素为空,或者head元素中的第一个元素是元素,则可以省略head元素的开始标记.
如果head元素没有紧跟空格字符或注释,则可以省略head元素的结束标记.
如果元素为空,或者body元素中的第一个元素不是空格字符或注释,则可以省略body元素的开始标记,除非body元素中的第一个元素是脚本或样式元素.
如果body元素没有紧跟注释,则可以省略body元素的结束标记.
所以你的例子是有效的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>
请注意,注释"此脚本将在头部"实际上被解析为正文的一部分,尽管脚本本身是头部的一部分.根据规范,如果你想要完全不同,那么</HEAD>和<BODY>标签可能不会被省略.(虽然对应<HEAD>和</BODY>标签尚可)
Liz*_*aly 14
在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
在HTML5中,没有完全没有"必需"或"可选"元素,因为HTML5语法的定义更加松散.例如,title:
在大多数情况下,title元素是必需的子元素,但是当更高级别的协议提供标题信息时,例如,当HTML用作电子邮件创作格式时,例如在电子邮件的主题行中,title元素可以省略.
http://www.w3.org/TR/html5/semantics.html#the-title-element-0
在真正的XHTML5中省略它们是无效的,尽管几乎从未使用过(与XHTML-acting-like-HTML5相比).
但是,从实际角度来看,您经常希望浏览器以"标准模式"运行,以便在呈现HTML和CSS时具有可预测性.提供DOCTYPE和更结构化的HTML树将保证更可预测的跨浏览器结果.
- 不要用标签混淆元素.请参阅cHao在本页其他地方的评论.对于`html`,`head`和`body`,元素是必需的,但标签是可选的. (13认同)
Pet*_*all 13
确实,HTML规范允许在某些情况下省略某些标签,但通常这样做是不明智的.
它有两个效果 - 它使规范更复杂,这反过来又使浏览器作者更难编写正确的实现(如IE所示错误).
这使得规范的这些部分中的浏览器错误的可能性很高.作为一个网站作者,你可以通过包含这些标签来避免这个问题 - 所以虽然规范没有说明你必须这样做,但这样做可以减少出错的可能性,这是一个很好的工程实践.
更重要的是,最新的HTML 5.1 WG规范目前表示(请记住,这是一项正在进行的工作,可能还会改变).
如果元素为空,或者body元素内的第一个东西不是空格字符或注释,则可以省略body元素的开始标记,除非body元素中的第一个元素是元,链接,脚本,样式或模板元素.
http://www.w3.org/html/wg/drafts/html/master/sections.html#the-body-element
这有点微妙.您可以省略正文和头部,然后浏览器将推断应该插入这些元素的位置.这带来了不明确的风险,这可能导致混淆.
所以这
<html>
<h1>hello</h1>
<script ... >
...
导致script元素是body元素的子元素,但是这样
<html>
<script ... >
<h1>hello</h1>
会导致脚本标记成为head元素的子元素.
你可以通过这样做来明确
<html>
<body>
<script ... >
<h1>hello</h1>
然后,无论你有第一个,脚本还是h1,它们都会出现在body元素中.这些是在重构和调试代码时容易忽略的事情.(例如,你有JS正在寻找正文中的第一个脚本元素 - 在第二个片段中它将停止工作).
作为一般规则,明确事物总是比把事情留给解释更好.在这方面,XHTML更好,因为它迫使您完全明确代码中的元素结构,这使得它更简单,因此不易被误解.
所以是的,你可以省略它们并在技术上有效,但这样做通常是不明智的.
- IE 出错是因为作者不太关心标准。如果它不能正常工作，那是他们的错。定义了标准，因此它们应该确保 IE 与它们一起工作。 (2认同)
- @KenSharp我不同意,但在你强迫所有客户不使用它之前,我们有点坚持.因此编写完全明确的代码更好,而不是依赖于应有的一切. (2认同)
| 归档时间： |
|
| 查看次数： |
99712 次 |
| 最近记录： |