美文网首页
html-DOCTYPE的深入研究

html-DOCTYPE的深入研究

作者: 剑来___ | 来源:发表于2018-12-08 15:55 被阅读8次

最近在写原生的html代码,突然记起以前在大学里学html的时候,那个时候还是html4,没有像现在html5这样简洁的声明方式,尤其是doctype这一块。现在特地去查了资料,深入了解这一狂的内容。

浏览器的呈现的模式

在早期的html代码中,不是所有的开发者都会遵循标准去写,因为随着时间的变化,标准也会不断改变,所以现代的浏览器都有着不同的呈现模式去兼容一些老的代码。

  1. Standards(标准)模式:遵循最新标准。
  2. Quirks(怪癖/兼容)模式:帮助处理所有奇怪的渲染和非浏览器兼容及不符合标准的网页。
  3. Almost Standards(近似标准)模式:针对标准的某个老版本设计的网页。

其中doctype就是可以指定浏览器按照不同的解析规则去选择呈现模式的一个标记,

DOCTYPE声明告诉类似的代码校验器或者浏览器应该按照什么规则集解析文档,这些“规则”就是W3C发表的文档类型定义(DTD)中包含的规则。

以上是DOCTYPE的作用,同时它也有一个有效性验证的作用,具体表现在,
如果发送具有正确的MIME类型的XHTML文档,理解XML的浏览器将不显示无效的页面。因为浏览器需要知道要使用什么DTD才能正确地处理页面,所以对页面进行有效性验证时要求有DOCTYPE声明。

DTD文档类型定义

那么既然doctype是根据dtd的文档定义去选择呈现模式,我又去查询了一下这个dtd。

DTD中包含了一系列标记、属性,用于标记Web文档中能出现哪些元素和元素之间的包含关系。如果没有指定有效的DOCTYPE声明,浏览器可能会使用内置的默认DTD。你也可以自定义DTD,但一般不推荐这样。常见的DOCTYPE声明如下:

HTML 2:
<!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN">

HTML 3.2:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

HTML 4.01 Strict:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

HTML 4.01 Transitional:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

HTML 4.01 Frameset:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

XHTML 1.0 Strict:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1.0 Transitional:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1.0 Frameset:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

XHTML 1.1 plus MathML plus SVG:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN" "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">

......那为啥我写html5的时候只有简短的一句话?

<!DOCTYPE html> 

html5和html4的区别

原来以上是html4的写法,区别在于.....

  • HTML5 不基于 SGML,因此不需要对DTD进行引用,但是需要doctype来规范浏览器的行为(让浏览器按照它们应该的方式来运行)
  • 而HTML4.01基于SGML,所以需要对DTD进行引用,才能告知浏览器文档所使用的文档类型

SGML和XML以及HTML

那么问题来了,这个sgml是啥......这里我引用一下一个连接,很关键,这里介绍的很全

http://www.worldhello.net/doc/docbook_howto/ar01s04s01.html

sgml是一种通用标准标记语言,xml是一种可扩展标记语言,xml是sgml的子集,这里发现了一个共同点,标记语言!没错,html的全称是超文本标记语言,没错,它也是一种标记语言!
经过一番调查,发现

  • SGML是现时常用的超文本格式的最高层级标准,是可以定义标记语言的元语言,甚至可以定义不必采用< >的常规方式.(来自wiki)

  • XML是用来传送及携带数据信息,不用来表现或展示数据

  • HTML语言则用来表示数据.XML是从SGML简化修改出来的.

也就是说,SGML可以算是XML和HTML的parent,SGML提供了一种定义标记语言的方式,告诉他的child可以做什么不可以做什么,必须包括什么元素,例如标签,以及语言的基本结构.
在介绍sgml的时候发现

利用SGML创建了HTML参照和必须共同遵守的DTD,你会经常在HTML页面的头部发现“DOCTYPE”属性,用来定义用于解析目标DTD,

这就是html4遵循的sgml为什么要写这么长了,html5写那么短是因为它没有基于SGML而基于XML所以不需要引用DTD。
而且现在解析SGML是一件麻烦的事情,所以创建了XML更简化.例如:在SGML中你必须使用起始和结束标签,但是在XML你可以有自动关闭的结束标签

DOCTYPE切换

在网上查资料的时候看到

浏览器根据不同的DOCTYPE选择不同的渲染方法就叫做DOCTYPE切换。 其实DOCTYPE切换就是用来识别和兼容旧网页的。

总结一下就是
以下情况浏览器会采用标准模式渲染:

  • 给出了完整的DOCTYPE声明
  • DOCTYPE声明了Strict DTD
  • DOCTYPE声明了Transitional DTD和URI
    以下情况浏览器会采用混杂模式渲染:
  • DOCTYPE声明了Transitional DTD但未给出URI
  • DOCTYPE声明不合法
  • 未给出DOCTYPE声明

相关文章

  • html-DOCTYPE的深入研究

    最近在写原生的html代码,突然记起以前在大学里学html的时候,那个时候还是html4,没有像现在html5这样...

  • 学习股票

    炒股好多年,没有深入研究和学习,这是最大的缺憾,下定决心深入研究

  • 每日单词2018-04-11

    delved 深入研究

  • GCD的深入研究

    本文是接上一篇文章《iOS——多线程理解》https://www.jianshu.com/p/81cc15d5ae...

  • 容器的深入研究

    一.完整的容器分类法 二.collection接口 1.boolean add(T)确保容器持有具有泛型类型T的参...

  • JAVA深入研究——Method的Invoke方法

    JAVA深入研究——Method的Invoke方法。

  • gradle深入研究

    Gradle 1.基本元素 Project 每个项目的编译至少有一个 Project,一个 build.gradl...

  • Block 深入研究

    Block的本质 首先,我们利用clang 命令查看一下声明Block对应的c++代码( xcrun -sdk i...

  • block深入研究

    1、写一个OC文件.m文件如下: 2、使用clang命令将.m编译成.cpp文件,命令如下: 3、打开.cpp,可...

  • 深入研究 Activity。

    开题先说一声,这次的研究比较让人恶心,但是也会让你感觉到很爽。很多地方的注释都很详细,英语好的直接看懂,不好的也好...

网友评论

      本文标题:html-DOCTYPE的深入研究

      本文链接:https://www.haomeiwen.com/subject/hkssbftx.html