1.有关doctype

H4之前都比较麻烦,需要定义文档类型,给出文档标准dtd地址。实际上这个doctype并不是写给浏览器看的,而是写给验证器看的,也就是说,在文档一开头写那行,是为了验证器按照该doctype来验证我的文档。但是实际上,浏览器需要遵守伯斯塔尔法则,需要对页面内容完全开放,向前向后最大可能的进行兼容,按照最初设计初衷来说,浏览器是不关心你的doctype是什么的。

但是任性的微软让某不符合常理的情况常出现了,使得doctype确实影响了浏览器的渲染。微软为了向后兼容标准模式,又向前兼容怪异模式,于是在doctype上动了手脚。凡是有效的doctype就可以触发标准模式渲染,而不符合标准的可以触发浏览器的怪异模式。我们今日使用doctype时,之所以感觉它非常重要,是因为我们总是利用它来激活标准模式。

h5的出现使我们是时候走出怪异模式的阴影了。只需要一句<!doctype html>即可声明h5。这句话是有效的doctype,因而它只会触发标准模式。

2.h5中加入的新的form元素

因为对h5兼容性的担心,与对手工处理优雅降级的懒惰,使我很少去用到它。在一次工作中,偶然发现周围的同事都在用h5,在大多数应用场景完全没必要担心浏览器的兼容性问题。而我还在看苦逼的用js实现一个input框的placeholder功能,顿时觉得自己傻透了。于是放下了手中的权威宝典,重新学习h5与css3。列个笔记在这里:

新增的常用属性:autofocus,placeholder,required,autocomplete,max,min,step,pattern,novalidate。

全局属性:contentEditable,designMode(仅可js控制),textindex。

新增input对象:email,url,number,range,date(datetime and so on),search,tel,color,datalist。这些对象会在移动端有相应的表现。

3.webstorage

  1)localStorage 

  与cookie一样,只要是同源页面,都可以访问同一个localStorage。关闭窗口再打开,或者同时打开多个窗口,只要同源都可以访问到同样的内容。

  但是onStorage监听函数的兼容性很不好,不同浏览器的注册方式不一样,所以使用需要慎重。

  2)sessionStorage

  不会有同源页面的数据共享问题,可以很好的避免数据泄露。为会话级,关闭浏览器就会消失。

4.对于chrome字体不能小与12px,只需要加一句-webkit-text-size-adjust:none;就可以。但是不要把它应用在全局,不然会使网页缩放失效。