1.文档模式

文档模式的概念是由IE5.5引入,通过使用文档类型(DOCTYPE)切换实现的。不同的文档模式主要影响CSS内容的呈现,尤其是浏览器对盒模型的解析,但在某些情况下也会影响到JavaScript的解释执行。

文档模式的种类

目前存在的文档模式主要有四种:

  混杂模式(怪异模式 quirks mode):让IE的行为与(包含非标准特性的)IE5相同;

  标准模式(非怪异模式 standard mode):让IE 的行为更接近标准行为(W3C标准)。

  准标准模式(有限怪异模式 almost standard mode):由于该模式离W3C标准仍然有一段距离,因此被称作准标准模式(或有限怪异模式)。IE6、7的标准模式实际上就是准标准模式,而IE8+才有实质上的标准模式。在该模式下的浏览器特性有很多都是符合标准的,但是也存有例外。不标准的地方主要体现在处理图片 间隙的时候(表格中使用图片是问题最明显)。

  超级标准模式:  IE8引入的一种新的文档模式,超级文档模式可以让IE以其所有版本中最符合标准的方式来解释网页内容

  准标准模式与标准模式的区别几乎可以忽略不计。因此,有时候说的“标准模式”,有可能是这两种模式的任一种。

开启文档模式:

对于标准模式,可以用下面的任何一种文档类型来开启:

<!-- HTML 4.01 严格型 -->
<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!-- XHTML 1.0 严格型 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--HTML 5-->
<!DOCTYPE html>

对于准标准模式,可以使用过渡型(transitional)或框架集型(frameset)的文档类型来触发:

<!-- HTML 4.01 过渡型 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- HTML 4.01 框架集型 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <!-- XHTML 1.0 过渡型 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!-- XHTML 1.0 框架集型 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

2.<!DOCTYPE>声明

  DOCTYPE是document type(文档类型)的简写形式。用来说明使用的XHTML或者HTML的版本。其中的DTD(例如上面提到的的xhtml1-transitional.dtd)叫文档类型定义,里面包含了文档的规则,浏览器就根据你定义的DTD来解释你页面的标识,并展现出来。几种DTD的声明见文档模式的开启。

<!DOCTYPE>声明的作用:

  声明文档的解析类型(document.compatMode),避免混杂模式(怪异模式)。

  document.compatMode:
    BackCompat:怪异模式,浏览器使用自己的怪异模式解析渲染页面。
    CSS1Compat:标准模式,浏览器使用W3C的标准解析渲染页面。

  如果在文档那个开始处没有发现文档类型声明,则所有浏览器都会默认开启混杂模式(按照自己的方式解析渲染页面),因为不同浏览器在该模式下的行为差异非常大,(如果不使用某些hack技术)从而导致跨浏览器的不一致性。

<!DOCTYPE>的使用:

  在html页面的第一行添加<!DOCTYPE>的声明即可。其中几种声明方式前面已经提到过。注意,使用HTML 5的话,直接在文档开头添加<!DOCTYPE html>即可。

3.严格模式

ECMAScript 5引入了严格模式(strict mode)的概念。严格模式是为JavaScript定义了一种不同的解析与执行模型。在严格模式下,ECMAScript3中的一些不确定的行为将会得到处理,而且对某些不安全的操作也会抛出错误。

严格模式的使用:

整个脚本中启用严格模式:在脚本的顶部添加代码:"use strict";

局部启用严格模式:比如指定某函数在严格模式下执行:

function doSomething(){
"use strict";
//函数体
}

其实,"use strict"这句代码是一个编译指示(pragma),用来告诉支持的JavaScript引擎切换都严格模式下。这是为了不破坏ECMAScript3的语法二特意选定的语法。在该模式下,JavaScript的执行结果会有很大的不同。

关于文档模式、DCOTYPE声明及严格模式的更多相关文章

  1. HTML文档类型DTD与浏览器怪异模式

    虽然在兼容IE6时候经常会注意到两个模式的区别,但是系统的理解起来,还没有认真总结过.看了一些网上的资料.结合自己的理解汇总了一下,放在这里备忘并分享给大家. 浏览器从服务端获取网页后会根据文档的DO ...

  2. Prism 4 文档 ---第5章 实现MVVM模式

        MVVM模式有助于清楚的区分应用程序界面的业务层和展现层.保持一个清晰的应用程序逻辑和UI分离有助于处理开发和设计过程中大量的问题,同时,使得应用程序的测试,维护,和扩展更加容易.MVVM也可 ...

  3. 2013第49周三IE9文档模式

    今天完善了原有模块的代码和注释,然后继续之前新模块的开发,并写了两边的service接口,除了因为邮件中有部分问题让我分心外,专心下来写代码的感觉真好,今天基本上没遇到多少让我新感悟的技术问题,就总结 ...

  4. 文档类型、DOCTYPE切换和浏览器模式

    DTD(文档类型定义)是一种机器可读的规则,它们定义XML或HTML的特定版本中允许有什么.不允许有什么.在解析网页时,浏览器将使用这些规则检查页面的有效性并且采取相应的措施.浏览器通过分析页面的DO ...

  5. 文档类型DTD,DOCTYPE和浏览器模式

    出处:http://blog.csdn.net/freshlover/article/details/11616563 浏览器从服务端获取网页后会根据文档的DOCTYPE定义显示网页,如果文档正确定义 ...

  6. IE的文档模式, 及Textarea呈现bug一例

    做了个非常简单的页面, 仅有几行html代码, 内容如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtm ...

  7. 【HTML&CSS】 第一章:DTD文档声明

    <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前. <!DOCTYPE> 声明不是 HTML 标签:它是指示 web 浏览器关 ...

  8. html4.0.1,h5,xhml,文档声明区别

    <!DOCTYPE> 声明不是 HTML 标签:它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令. 提示:请始终向 HTML 文档添加 <!DOCTYPE> ...

  9. 1关于script标签属性,注意点,浏览器文档模式,各种数据类型的转化

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

随机推荐

  1. 【逆向工具】IDA使用3-全局变量、数组、结构体

    全局变量 测试代码 全局变量既可以是某对象函数创建,也可以是在本程序任何地方创建.全局变量是可以被本程序所有对象或函数引用.下面这段代码中将int.float.char变量定义在main函数之外. / ...

  2. ARMV8 datasheet学习笔记3:AArch64应用级体系结构之Memory Type and Attributes

    1.前言 2. Memory类型和属性 memory分为normal memory和device memory,两种类型的Memory有各自的属性,除了下面介绍的几种属性外,还有其他一些杂项属性 2. ...

  3. MySQL 误操作后数据恢复(update,delete忘加where条件)【转】

    在数据库日常维护中,开发人员是最让人头痛的,很多时候都会由于SQL语句 写的有问题导致服务器出问题,导致资源耗尽.最危险的操作就是在做DML操作的时候忘加where条件,导致全表更新,这是作为运维或者 ...

  4. ActiveMQ 入门Nodejs版

    ActiveMQ 入门下载与安装 官方下载地址 解压,运行bin/win[32|64]/activemq[.bat] 启动服务 环境信息 控制台: http://localhost:8161 默认端口 ...

  5. opencv 图像深度(depth)

    原文地址:http://blog.csdn.net/dingfc/article/details/7457984 图像深度是指存储每个像素所用的位数,也用于量度图像的色彩分辨率.图像深度确定彩色图像的 ...

  6. ajax模拟获取json

    现在工作中我用到获取数据的方式,基本都是ajax.前台获取后端的数据后,需要进行处理,然后把他们放进页面中的相应标签里.下面举一个简单的例子,来模拟数据的获取和摆放. 这里用ng框架获取数据然后处理, ...

  7. 转载:磁盘目录(1.3.3)《深入理解Nginx》(陶辉)

    原文:https://book.2cto.com/201304/19614.html 要使用Nginx,还需要在Linux文件系统上准备以下目录. (1)Nginx源代码存放目录 该目录用于放置从官网 ...

  8. Linux中断处理(一)

    最近在研究异步消息处理, 突然想起linux内核的中断处理, 里面由始至终都贯穿着"重要的事马上做, 不重要的事推后做"的异步处理思想. 于是整理一下~~第一阶段--获取中断号每个 ...

  9. javaMelody监控javaWeb程序性能

    JavaMelody应用监控使用指南 原文:<JavaMelody应用监控使用指南> 前言 本文参考JavaMelody的UserGuide编写,部分文字均来自文档,添加有个人理解.并进行 ...

  10. OCM_第十八天课程:Section8 —》RAC 数据库 _ RAC DB 搭建/RAC DB 配置使用

    注:本文为原著(其内容来自 腾科教育培训课堂).阅读本文注意事项如下: 1:所有文章的转载请标注本文出处. 2:本文非本人不得用于商业用途.违者将承当相应法律责任. 3:该系列文章目录列表: 一:&l ...