1 如何发现问题 详见
1.1 QuirksMode
- QuirksMode:兼容行列表
- 比较老
- 可以看到所有的CSS、DOM、HTML等标签在各个浏览器的兼容性
1.2 CanIUse
- can I use:这个名字也是十分直白,就是查查看这个标签能不能在这个额浏览器里用
- 查询JS特性,CSS属性,HTML等一些标签到底能在什么浏览器中兼容
- 可以查看在哪个国家
- 可以对比某一标签在不同浏览器里对比的一些兼容性问题
2 如何解决问题 详见
2.1 BrowserHacks
- BrowserHacks:如何查询不同浏览器
- 顾名思义,叫浏览器黑客,现在黑客又叫黑科技。
- 平时遇到一些浏览器兼容问题,这时候我们就会用到CSS HACK,但是HACK并不容易记住,所以每次遇到HACK的时候都是搜索一下,但搜索出来的结果不是很理想,所以今天为大家介绍个不错的网站,里面集合所有浏览器CSS和JavaScript的HACK写法,“所有”是指主流浏览器,当然包括万恶的IE6!!!!
- 支持安卓设备,Chrome,Firefox, IE
- 最重要的就是IE了,因为IE的一些特殊样式比较多
2.2 ES5Shim
- 那么关于浏览器的shim其实它是一种技术,就是说对于一些不支持某一些特性的浏览器,我通过一些打补丁的方式,把它补充到能完全兼容es5
2.3 ES6Shim
- es6的shim支持很多非常新的特性,那么当然它的shim的脚本就比较大了,es6的shim引用的方式跟es5其实是比较相似的
3如何把事情做绝 详见
3.1 Modernizr
- Modernizr 会在页面加载后立即检测特性;然后创建一个包含检测结果的 JavaScript 对象,同时在 html 元素加入方便你调整 CSS 的 class 名。
- 基于Modernizr做渐进增强
- 全局安装
- 获取配置,需要自定义构建
- 生成构建,用命令行
- 引入脚本
- 直接使用
3.2 Feature.js
- featurejs 是一个很简单、快速和轻量级的浏览器特性检测库,它没有任何依赖,体积压缩最后只有1KB,它可以自动初始化,在你需要知道某个特性是否可用时,直接引入即可。