最近前端的群都蛮热闹的,但我发现多数讨论的是javascript和css相关的问题,仿佛大家在努力创建各种交互、样式的时候,忘却了这一切的基础 – HTML。

其实我很喜欢HTML,觉得这个语言远比XML来得有趣,其灵活、轻便远非极端规范的XML可以比拟。同时又因为HTML的作用范围极小,规定的标签有限等说不上优点还是缺点的特色,使得HTML有着自己的确定性。

本系列的前面很大一部分会以非常短小的篇幅,介绍HTML5中的一些基本概念,并且:

只关心HTML这个语言,其他的javascript或者css完全不会涉及。
只关注HTML,对XHTML会简要带过,但不会详细说明,这源于XHTML有着比HTML更严格的规范,对浏览器的解析而言,可以认为是HTML的一个子集。
主要参考了whatwg的官方文档,并对现有主流浏览器的兼容性进行了评估。
介绍的全是基本的概念,不会涉及文档解析、DOM树构建、脚本执行之类的实现细节。
在这之后,可能会提取部分与浏览器的运行相关的技术细节,如脚本的解析、执行等话题来进行更深入的探讨。

如果你觉得HTML不爽,因为开始标签和结束标签可以随便省略太不规范,那么这个系列会告诉你,HTML的标签省略是有非常严格的规定的……

如果你觉得HTML简单,大不了照着XML来写,那么这个系列会告诉你,HTML里充满着陷阱,即便不考虑各浏览器的实现,你也不见得能安全走过这片雷区……

在开始这个系列以前,有几个非常重要的概念需要介绍。HTML中有着很多很多的概念,具体可以参见Terminology一章,但有一部分并不会在参考手册中被广泛引用,只有其中的一小块有着了解的意义:

浏览上下文 – browsing context
就是我们通常见到的页面,确切地主,浏览上下文是一个环境,在这个环境中,HTML会被解析、构建,CSS样式会被计算、应用,javascript脚本会被加载、执行,最终展现出终端用户可以看到的内容。

通常来说,我们最常接触的上下文有这么几种:

一个浏览器窗口,比如一个IE6窗口。
多标签浏览器里的一个标签,Firefox、Chrome等浏览器都是这么做的。
一个<iframe>元素也是一个独立的浏览上下文。
在frameset中,一个<frame>元素也会形成一个独立的浏览上下文。
换行 – new line
和计算机基础课程所学的一样,HTML定义了3种类型的换行符:

字符U+000D,即\r字符。
字符U+000A,即\n字符。
字符U+000D后跟着U+000A,即\r\n字符串。
不同的系统有其默认的换行输出,HTML的规定保证浏览器能正确解析现在主流的3种换行方式。

空格 – space
空格在HTML中有着非常重要的作用,如一个元素的各属性之间可以通过空格分隔。正常情况下,开发人员会按一下空格键来输入一个空格,当属性很多的时候,可能使用回车来将属性更好地排列起来。但是大概很少有人会去思考,为什么回车的效果和空格是一样的,HTML还能解析哪一些字符作为空格呢?

字符U+0020,就是普通的空格。
字符U+0009,就是\t水平制表符。
字符U+000A,就是\n换行符。
字符U+000D,就是\r回车符。
字符U+000C,这个是分页符,很少见到。
关于空格的问题,其中jQuery也犯过这个问题,甚至至今都存在这个问题。在jQuery 1.5.1的第1738行定义了一个正则表达式/[\n\t\r]/g,用于通过空格来分隔元素的class属性。在1.4.4版本中,这个正则是/[\n\t]/g很显然漏掉了\r,这个BUG项就说明了这个问题。当然很遗憾,1.5.1版本依旧没有照顾到标准中的所有空格字符,即没有对U+000C分页符的处理。

HTML5标准简介的更多相关文章

  1. dicom通讯的工作方式及dicom标准简介

    本文主要讲述dicom标准及dicom通讯的工作方式.dicom全称医学数字图像与通讯 其实嘛就两个方面 那就是“存储”跟“通讯”. 文件数据组织方式  网络数据组织方式.文件数据组织方式就是解析静态 ...

  2. 2.HTML5 标准改变,准备工作

    1.HTML5 标准改变: Html5 不是SGML,XML语言,没有有效性检查,是规范,有松散的写法 不许写结束标签:area,base,br,col,hr,img,input,link,sourc ...

  3. 转:HTML5标准与性能之四:asm.js

    HTML5标准与性能之四:asm.js Cong Liu (Intel) 于 星期五, 24/05/2013 - 01:13 提交 之前的几篇文章分别介绍了WebWorkers.Typed Array ...

  4. 历时八年,HTML5 标准终于完工了

    万维网联盟(W3C)2014年10月29日泪流满面地宣布,经过几乎8年的艰辛努力,HTML5标准规范终于最终制定完成了,并已公开发布. 在此之前的几年时间里,已经有很多开发者陆续使用了HTML5的部分 ...

  5. DRM你又赢了:其API纳入HTML5标准

    摘要:W3C今天发布了一份加密媒体扩展工作草案(EME),将支持DRM多媒体数字内容,而且浏览器将无需使用Flash或Silverlight.EME定义了一系列API,允许JavaScript和HTM ...

  6. 从html5标准的正式发布到国内CMS的变革

    10月底万维网联盟(W3C)宣布,经过将近8年的艰辛努力,HTML5标准规范终于最终制定完成并正式发布. W3C的正式批准让人们对HTML5更有信心.“这是一个里程碑,标志着很多人员在长达七年时间内投 ...

  7. W3C小组宣布:HTML5标准制定完成

    近日,W3C小组宣布已经完成对HTML5标准以及Canvas 2D性能草案的制定,这就意味着开发人员将会有一个稳定的“计划和实施”目标. Web性能工作组已经推出W3C的两个版本建议草案. Navig ...

  8. HTML5 标准规范完成了

    ​    ​万维网联盟(W3C)昨天宣布,HTML5 标准规范终于最终制定完成了,并已公开发布.对于前端工程师来说,这无疑是一个振奋人心的好消息. ​    ​众所周知,HTML5改变了互联网,将成为 ...

  9. HTML 参考手册- (HTML5 标准)

    HTML 参考手册- (HTML5 标准) 功能排序 New : HTML5 新标签 标签 描述 基础   <!DOCTYPE>  定义文档类型. <html> 定义一个 HT ...

随机推荐

  1. ubuntu 12.04 安装Docker 实战

    2016-3-8 从网络服务商那里申请到一台Ubuntu测试服务器,用来测试安装Docker环境. 注:本人初学Docker,对Linux命令也仅是稍稍了解,如有错误,烦请告知. 查看系统相关信息 可 ...

  2. WPF Wonders: Transformations (and Robots!)

    indows Presentation Framework (WPF) gets a lot of mileage out of being layered on top of DirectX, in ...

  3. 打包时Xcode报:此证书的签发者无效Missing iOS Distribution signing identity

    问题描述 今天准备打包上传AppStore,结果Xcode报以下错误:Missing iOS Distribution signing identity for XXXXXX 查看证书后发现,Deve ...

  4. IOS , plist 配置项说明

    本文转载至 http://blog.csdn.net/fengsh998/article/details/8307424 Key:Application can be killed immediate ...

  5. JS/React 判断对象是否为空对象

    JS一般判断对象是否为空,我们可以采用: if(!x)的方式直接判断,但是如果是一个空对象,比如空的JSON对象,是这样的:{},简单的判断是不成功的,因为它已经占用着内存了,如果是JQuery的话, ...

  6. UNIX环境高级编程笔记之文件I/O

    一.总结 在写之前,先唠几句,<UNIX环境高级编程>,简称APUE,这本书简直是本神书,像我这种小白,基本上每看完一章都是“哇”这种很吃惊的表情.其实大概三年前,那会大三,我就买了这本书 ...

  7. 随手写的自动批量编译部署NativeAndroid程序Python脚本

    背景 有一堆工程NativeAndroid程序,要一一编译部署编译测试,手头只有AndroidManifest和Makefile,需要一个个Update,Ndk-build,和发包安装测试,很是头疼, ...

  8. [转载]斐讯K2 A2版免TTL刷BREED不死Bootloader

    1:路由器能正常上网,登陆进路由器 (默认密码admin) 2:用浏览器打开这个网址,如果默认ip不是192.168.2.1修改一下.打开后等待即可自动刷入breed. http://192.168. ...

  9. HP P1008打印机如何打印特殊纸张

    一.问题的提出 HP P1008中间有一个进纸槽,这是干什么的? 二.问题的分析 查说明,说这个进纸槽是叫做优先进纸槽,用于各种非常规的纸张的打印. 三.问题的解决 弄一张特殊尺寸的纸张,打开要编辑的 ...

  10. 深入理解图优化与g2o:图优化篇

    前言 本节我们将深入介绍视觉slam中的主流优化方法——图优化(graph-based optimization).下一节中,介绍一下非常流行的图优化库:g2o. 关于g2o,我13年写过一个文档,然 ...