那些前端程序员深信不疑的谣言( HTML 篇)

2017-02-26 12:08:41 +08:00
 FrankFang128

本文不考虑「团队规范」、「可读性」,只谈「语法」。

你了解完语法再去搞什么「团队规范」、「可读性」吧,不要本末倒置。

这里只讨论 HTML 5 ,不讨论 HTML 4.x 和 XHTML ,谨记!

谣言 1 :属性一定要用引号包起来,比如 <div id="test">

正解: HTML 文档写得很清楚,属性有四种写法(突然有茴香豆既视感 /(ㄒoㄒ)/~~)

1 <input disabled>
2 <input value=yes>
3 <input type='checkbox'>
4 <input name="be evil">

有人一定会说加引号「最安全」,骗新人说「引号必须写」很省事啊。

我对此嗤之以鼻。

谣言 2 :自闭合标签一定要以 /> 结尾,比如 <input /> <img />

正解:其实在 HTML 5 里 <input> 才是正确写法,详见 HTML 5 规范文档里的三处

Void elements only have a start tag;
Then, if the element is one of the void elements, or if the element is a foreign element, then there may be a single "/" (U+002F) character. This character has no effect on void elements, but on foreign elements it marks the start tag as self-closing.
Void elements: area, base, br, col, embed, hr, img, input, keygen, link, meta, param, source, track, wbr

很容易推理出:对于 void elements ,<meta /> 完全可以写成 <meta>,而且是推荐写法。

谣言 3 :所有标签必须闭合,比如 <p></p>

正解:请看 HTML 5 规范文档

A p element's end tag may be omitted if the p element is immediately followed by ...

所以以下写法完全符合要求

<p> 你好,
<p> 我是方方

谣言 4 : HTML 5 文档里必须写 <html> <head><body> 标签

正解:在没有注释的前提下,这三个标签都是可不写的。具体看规范文档。

下面这段 HTML 是合法的 HTML 5

<!DOCTYPE html>
<title>这是一个合法的 HTML 5 文档</title>
<meta charset="UTF-8">
<p>这是一个合法的 HTML 5 文档

以上哪个谣言是你深信不疑的?

12322 次点击
所在节点    HTML
109 条回复
FrankFang128
2017-02-26 13:37:35 +08:00
/t/343251 各位如果有被打脸的,请对号入座。
@starvedcat @Kei @peesefoo @murmur @zkd8907 @ksco @otakustay @ericls
lianyue
2017-02-26 13:45:26 +08:00
不光 <p>

<tr> 什么的也是 很多标签不能连续嵌套的 会自动闭合
acmetal
2017-02-26 13:47:32 +08:00
其他的不做评论,第四条附言写得好,对比三四年前的 V2 ,水越来越多,干货几近消失。
FrankFang128
2017-02-26 13:50:35 +08:00
@acmetal 现在是一群器材党。以前都是大牛。
shijingshijing
2017-02-26 13:58:00 +08:00
@FrankFang128 不要默认所有浏览器都能自动替你做事情,这种有头没尾的东西是绝壁会被我家的 Software Coding Standard 给 prohibit 掉的,跟需求里面的 Dangling Requirements 一样, ambiguity 会在一开始 review 的时候就给挑出来并干掉,否则通不过。所有的东西,都必须 defined and determined ,软件最不需要的就是各种 surprise
popu111
2017-02-26 13:59:25 +08:00
嘛。。。个人习惯而且能用就好了
shijingshijing
2017-02-26 14:01:10 +08:00
就跟做编译器一样,你不能期待编译器给你自动去做一些事情,虽然 IDE 和编译器能帮你做不少事情,也有容错机制,但是如果你就此产生依赖,相信我,总有一天你会 pay-off 的。
narrowei
2017-02-26 14:22:40 +08:00
科普的很棒啊,学到了很多。支持楼主!
seeker
2017-02-26 14:40:04 +08:00
原来如此,谢谢楼主。
FrankFang128
2017-02-26 14:40:57 +08:00
@narrowei
@seeker
像你们这样的回复就很好嘛 O(∩_∩)O 哈哈~
上面都是戾气
starvedcat
2017-02-26 14:43:52 +08:00
。。。。。。。。。。。。。。。。。。。。。
我说你文章写的对,你专程 @ 我说打脸了。我真心搞不懂了
Jordan
2017-02-26 14:52:05 +08:00
这是一份写给浏览器的规范
rogerchen
2017-02-26 15:00:32 +08:00
DO NOT be a language lawyer.
Whenever you get confused, RTFM.
FrankFang128
2017-02-26 15:00:51 +08:00
@starvedcat 没有啦,我把回复的全都 at 了,让大家自己看脸有没有被打 。 不好意思哈~~~
FrankFang128
2017-02-26 15:01:40 +08:00
@rogerchen RTFM 是编程圣经啊,尤其是 F 这个词用得好。
iEverX
2017-02-26 15:38:39 +08:00
我有个问题,这些所谓的谣言,在说的时候是指语法规范吗?我觉得更多的是代码格式规范。。

比如许多人就说,写 Python 是必须用空格缩进。
不是说用 tab 不行。语法上有 tab 没有问题。那么这算谣言吗?
yoke123
2017-02-26 16:16:47 +08:00
属性 单引号 和 双引号 的区别是? 科普下
leesudo
2017-02-26 16:17:56 +08:00
不谈技术,从标题到内容到回帖,没看出来是来认真讨论问题的,一副好为人师的姿态。关键讨论的内容又并不是什么高深尖端的东西,何必。。。
zkd8907
2017-02-26 17:22:13 +08:00
@FrankFang128 您开心就好咯 已 block ,勿 @ :)
binux
2017-02-26 17:28:25 +08:00
@shijingshijing 编译器那叫未定义行为,而这个是标准定义了的行为。任何一个符合 HTML5 标准的浏览器都会帮你这么解析的,不要放在一起。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/343238

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX