前端拾遗HTML相关

HTML

1.html5新特性

语义标签：新增语义化标签如 header，footer，aside，section，nav等，新增多媒体标签audio video
属性：增强表单元素input type属性，新增表单元素如progress等，新增表单属性如placeholder，require等。meta 新增charset，script新增async异步加载。
API：新增拖放api，svg绘图，canvas绘图，web worker, websocket，地理定位。
存储：新增localStorage，sessionStorage，indexDB。引入了application cache 对web和应用进行缓存。

2.doctype作用

doctype用来告诉浏览器以什么文档标准解析文档
怪异模式：浏览器以自己的模式解析文档，不加doctype默认为怪异模式。
标准模式：浏览器w3c标准解析文档

3.前端存储以及它们的区别

cookie：http请求会带上cookie，大小为4k。
localStorage：持久性存储，页面关闭也不会清除，以键值对存储，大小5M。
sessionStorage：操作和大小与localStorage相同，区别在于浏览器选项卡（页面)关闭时被清除，不同选项卡之间不互通。
indexDB：NoSql数据库，使用键值对存储，异步操作数据库，支持事务，存储大小250MB以上，但是indexDB受同源策略影响。
Web Sql：浏览器模拟的关系数据库，开发者可以用sql语句操作数据库，兼容性差

4.href和src区别

浏览器遇到href时会并行下载资源，不会阻塞页面解析，例如link标签里引用css，不会阻塞页面解析，因此在引入css文件时建议使用link而非@import；而浏览器遇到src时会等待资源文件下载或执行完毕后再进行页面解析，例如script标签，所以一般script标签都放在最后

5.meta有哪些属性，作用
meta标签用来描述网页元信息

1.charset ： 定义html字符集

<meta charset='UTF-8'>

2.http-equiv: 可模拟http请求头，能够设置缓存，过期时间，刷新等。
expires：设置网页过期时间
set-cookie: 如果网页过期，cookie也会被清除
pragma: 用于禁止浏览器再本地缓存中调阅页面内容，设定后一旦离开网页就无法从cache中在调出
refresh: 定时刷新
X-UA-compatible: 使用的浏览器版本
Cache-control: 清除缓存

<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>
<meta http-equiv='Cache-Control' content='no-cache'>

3.viewport: 视口，控制页面宽高以及缩放比例
width/height：页面宽高，默认为980px
initial-scale: 初始缩放比例 1~10
maximum-scale/minimun-scale：允许用户缩放的最大/最小比例
user-scalable: 用户是否可以缩放 yes/no

<meta http-equiv='viewport' content='width=device-width, initial-scale=1, user-scalable=no'>