现在的各种前端开发工具都足够强大，支持插入模板代码，也就导致我们往往会忽略已经自动生成的代码，而代码的第一行 DOCTYPE 声明，就是最容易忽略的部分。

一、DOCTYPE

DOCTYPE 是 document type(文档类型的）的简写。

1.1 DOCTYPE 的作用

告诉浏览器需要通过哪一种规范（文档类型定义，DTD）解析文档（比如HTML或XHTML规范）；

二、DTD

DTD（document type definition，文档类型定义）是一系列的语法规则，用来定义 XML 或 (X)HTML 的文件类型。浏览器会使用它来判断文档类型， 决定使用何种协议来解析，以及切换浏览器模式。

三、浏览器模式

为了能够很好地显示满足标准的页面，又能最大程度兼容不合法的HTML。 浏览器厂商一般会提供两种浏览器模式。

3.1 标准模式

标准模式（standards mode）：浏览器根据W3C标准来渲染页面。

3.2 混杂模式

混杂模式（quirks mode）：浏览器采用更加宽松的、向后兼容的方式来渲染页面。

混杂模式下，浏览器会模仿旧浏览器的行为，比如IE6，在此基础上兼容新的标准特性。 混杂模式又称兼容模式、怪异模式等。

四、DOCTYPE 切换

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

五、<!DOCTYPE html>的重要性

5.1 声明文档的解析类型(document.compatMode)，避免浏览器的怪异模式

如果你是使用最新标准编写的页面但未给出 DOCTYPE 声明，这时就可能会出现一些怪异的行为。但若你声明了<!DOCTYPE html>，那么浏览器等同于进入了标准模式，并且按照W3C标准渲染页面。

阅读更多

前端面试题-<!DOCTYPE>的更多相关文章

  1. 前端面试题2016--HTML

    本文由我收集总结了一些前端面试题,初学者阅后也要用心钻研其中的原理,重要知识需要系统学习.透彻学习,形成自己的知识链.万不可投机取巧,临时抱佛脚只求面试侥幸混过关是错误的!也是不可能的!不可能的!不可 ...

  2. 2016最全的web前端面试题及答案整理

    面试web前端开发,不管是笔试还是面试,都会涉及到各种专业技术问题,今天小编整理了一些常见的web前端面试题及答案,希望对大家有所帮助. 1.常用那几种浏览器测试?有哪些内核(Layout Engin ...

  3. 常见前端面试题之HTML/CSS部分

    转自http://www.cnblogs.com/jscode/archive/2012/07/10/2583856.html Doctype是什么?如何触发严格模式与混杂模式模式?区分它们有何意义? ...

  4. 史上最全前端面试题(含答案)-A篇

    HTML+CSS1.对WEB标准以及W3C的理解与认识标签闭合.标签小写.不乱嵌套.提高搜索机器人搜索几率.使用外 链css和js脚本.结构行为表现的分离.文件下载与页面速度更快.内容能被更多的用户所 ...

  5. 【重点--web前端面试题总结】

    前端面试题总结 HTML&CSS: 对Web标准的理解.浏览器内核差异.兼容性.hack.CSS基本功:布局.盒子模型.选择器优先级及使用.HTML5.CSS3.移动端适应. JavaScri ...

  6. web前端面试题HTML/CSS部分

    web前端面试题HTML/CSS部分 前端页面有哪三层构成,分别是什么?作用是什么? 1.结构层:由 HTML 或 XHTML 之类的标记语言负责创建,仅负责语义的表达.解决了页面“内容是什么”的问题 ...

  7. web前端面试题库

    web前端面试题及答案   1.常用那几种浏览器测试?有哪些内核(Layout Engine)? 答: (Q1) 浏览器:IE,Chrome,FireFox,Safari,Opera.    (Q2) ...

  8. 第136天：Web前端面试题总结（理论）

    Web前端面试题总结 HTML+CSS理论知识 1.讲讲输入完网址按下回车,到看到网页这个过程中发生了什么 a. 域名解析 b. 发起TCP的3次握手 c. 建立TCP连接后发起http请求 d. 服 ...

  9. 前端面试题总结（一）HTML篇

    前端面试题总结(一)HTML篇 一.iframe的优缺点? 缺点: 1.会阻塞主页面的onload事件(iframe和主页面共享链接池,而浏览器对相同域的链接有限制,所以会影响页面的并行加载). 解决 ...

随机推荐

  1. rework-发出你的心声

    生意人虚张声势的时候会给人什么感觉?都是些僵硬的措辞.官方的腔调.虚伪的友善.法律术语等.你一定看过这些玩意儿,就好像是机器人写出来的东西,这些公司在向你发话,而不是和你对话. 这种专业主义面具让人觉 ...

  2. s检验|k-S检验|适应性检验|独立性检验|Cintinuity correction |Fisher‘s Exact Test|Likelihood Ratio|Person Chi-Square|φ系数|Cramer’s V|列联系数

    应用统计学: s检验是检验否符合正态,而k-S检验是检验否符合一种分布. 已知分布便知道参数,知道参数不知道分布. 适应性检验 多项式分布的情况如下例: 二项分布是多项式分布一种情况,所以就是上式中只 ...

  3. javascript中的undefined 和 not defined

    经研究发现,两者之间有很大的区别,不知从英语讲,这两者都有啥区别,研究结果如下 测试os:ubuntu 测试浏览器:chrome 测试案例1 console.log(a) 报错 ReferenceEr ...

  4. 蓝桥杯-PREV45-图形排版

    这是2017年蓝桥杯C组C++的压轴题,拿到之后没什么想法.但是蓝桥杯有部分分.所以直接敲了个大暴力提交上去过了一半的数据.后来想到了DP,但是没能实现出来,感觉还是有问题的.后来看了解题视频发现是预 ...

  5. centos5.5 下面 lnmp环境遇到的小问题

    A)nginx 启动:/www/nginx/sbin/nginx -c /www/nginx/conf/nginx.conf 查看: ps -ef | grep nginx 停止:强制停止所有Ngin ...

  6. 一、美国国家经济研究局NBER教育经济研究项目工作论文合集

    一.美国国家经济研究局NBER教育经济研究项目工作论文合集 (一)项目地址: American National Bureau of Economic Research - Economics of ...

  7. seckill

    京东自动登录 注:本文所做操作皆以京东web为例 包含:xpath,splinter,ocr 遇到的坑: 登录页面通过查看网页元素,能看到账户,密码唯一id,但是执行 12 browser.fill( ...

  8. Visual Studio通过Cordova支持混合跨平台移动开发

    Microsoft在Visual Studio 2013 Update 2中添加了对混合跨平台移动应用程序的本地支持. Microsoft早在2011年就已经开始了与PhoneGap的合作,那时候是为 ...

  9. HDU-2802-F(N)

    看到这题讨论版里有说用公式的有说用循环节的,但是个人觉得这两种方法都不靠谱,比赛场上做这种题能直接推出公式需要很强数学功底,而循环节的方法如果循环节比较大就不太好发现了.这种已知通项公式的题还是用矩阵 ...

  10. Hibernate实现步骤

    1. 引入jar文件(hibernate3.jar, lib\required目录下所有的jar,log4j记录的log4j-1.2.16.jar,slf4j-log4j12-1.5.8.jar,oj ...