HTML相关

Doctype作用？严格模式与混杂模式如何区分？它们有何意义?

告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE 不存在或格式不正确会导致文档以兼容模式呈现

行内元素、块级元素、行内块元素

行内：span、a…
块级：div、p、ul、h1…
行内块：img

浏览器内核

Trident内核：IE
Gecko内核：Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等。
Presto内核：Opera7及以上。 [Opera内核原为：Presto，现为：Blink;]
Webkit内核：Safari,Chrome等。 [ Chrome的：Blink（WebKit的分支）]

简述一下你对HTML语义化的理解

（1）HTML语义化让页面的内容结构化，结构更清晰，便于对浏览器、搜索引擎解析；
（2）即使在没有样式CSS的情况下也能以一种文档格式显示，并且是容易阅读的；
（3）搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重，有利于SEO；
（4）使阅读源代码的人更容易将网站分块，便于阅读、维护和理解。

请描述一下 cookies，sessionStorage 和 localStorage 的区别？

携带：
cookie 数据始终在同源的 http 请求中携带
sessionStorage 和 localStorage 不会自动把数据发给服务器，仅在本地保存
存储：
cookie一般大小在4K左右
storage一般在5M或以上
有效期：
cookie设置的有效期
localStorage只能主动删除
sessionStroage页面关闭就没了
共享：
sessionStorage 不能共享，localStorage 在同源文档之间共享，cookie 在同源且符合 path 规则的文档之间共享

页面导入样式时，使用 link 和@import 有什么区别？

从属关系区别：
@import 是 CSS 提供的语法规则，只有导入样式表的作用；
link 是 HTML 提供的标签，不仅可以加载 CSS 文件，还可以定义 RSS、rel 连接属性、引入网站图标等。
加载顺序区别：
link 标签引入的 CSS 被同时加载；
@import 引入的 CSS 将在页面加载完毕后被加载。
兼容性区别：
@import 是 CSS2.1 才有的语法，故只可在 IE5+ 才能识别；
link 标签作为 HTML 元素，不存在兼容性问题。

setTimeout 和 requestAnimationFrame

• setInterval存在丢帧现象
• requestAnimationFrame 解决丢帧问题，它在页面重绘前执行，兼容性不是很好

加载时间线

1、创建document对象，开始解析web页面，此阶段document.readyState=’loading’
2、 遇到link外部css，创建线程解析css，继续解析文档
3、遇到没有设置异步加载的script，页面发生阻塞，等到js解析执行完毕后继续解析文档
4、 遇到设置了异步加载的script，如果是async就异步加载js并立即执行
5、 遇到img标签，生成结构，然后异步加载css，继续解析文档
6、当文档解析完成，此时document.readState=’interactive’
7、 文档解析完毕后，所以defer加载的js顺序执行
8、document对象触发DOMContentLoader事件，标志程序执行从同步阶段到事件驱动阶段
9、当所以东西都加载完毕后，document.readState=’complete’，window触发load事件
10、从此以异步响应方式处理网络请求等

历史记录

通过修改 hash 和 hashchange 事件来实现历史记录管理

• pushState
  history.pushState(state, title, url); 添加一条历史记录
• replaceState
  history.replaceState(state, title, url); 替换当前的历史记录页面
  三个参数：
  state：一个与指定网站相关的状态对象，popstate事件触发时，该对象会传入回调函数中。如果不需要这个对象，此时可以填null
  title：新页面的标题，但是所有浏览器目前都忽略这个值，因此也可填null
  url：新的网址，必须与当前页面在同一个域，浏览器的地址栏显示这个网址

• pushState 和 replaceState不会刷新页面，只是更改了地址栏信息

History新增事件：调用history.pushState()或history.replaceState()不会触发这两个事件

• popstate
  历史记录发生改变时触发
• hashchange
  当页面的hash值改变时触发，常用于构建单页面应用

websocket

Websocket 是一种网络协议，是在HTTP基础上做了一些些优化的协议，与HTTP无直接关系
websocket存在的意义：因为HTTP协议有一个缺陷，通信只能由客户端发起，加入服务器端的数据更新了不能自行传递给客户端，websocket可以解决这个问题