浏览器兼容问题

来源:互联网 发布:红颜知已的图片 编辑:程序博客网 时间:2024/06/07 16:59

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,它可以自动初始化,在你需要知道某个特性是否可用时,直接引入即可。
原创粉丝点击