常见包的作用(佛系整理)

code-js

通常使用babel会间接的引入core-js

core-js提供了es5、es6的polyfills,包括promises、symbols、collections、iterators、typed arrays等等,并可以按需加载,使用它不会污染全局命名空间。

注意点:

  • polyfills
    前端通常在开发时需要考虑到浏览器对js,html5的支持,这些兼容都可以使用polyfills去处理。
    Polyfills 是由 RemySharp 提出的一个术语。如果浏览器中存在该功能,则polyfill可以让浏览器执行其操作,否则,polyfill会插入缺少的功能。填补了旧版浏览器的空白,然后就可使用缺失功能。

  • html5shim
    html5shim(也就是 html5shiv) 能够自动完成了设置 IE 浏览器和新语义元素的兼容性。
    主要解决HTML5提出的新的元素不被IE6-8识别,这些新元素不能作为父节点包裹子元素,因此,即使旧的 IE浏览器显示了 HTML5 的新语义元素,但不能应用CSS样式。
    解决方式:
    让CSS 样式应用在未知元素上只需执行 document.createElement(elementName)
    即可实现。html5shiv就是根据这个原理创建的。

    使用:

<!--[if lt IE 9]>
<script type="text/javascript" src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
  • shim 和 polyfill

  • localStorage的兼容
    HTML5 提供了两种在客户端存储数据的新方法:
    localStorage - 没有时间限制的数据存储
    sessionStorage - 针对一个 session 的数据存储
    其中localStorage 是最常用的,但是IE8以下不支持该特性。
    使用ployfiller可以让旧版的浏览器也支持这样的特性。
    Storage polyfiller
    store.js
    AmplifyJS

Remy Sharp 的Storage polyfiller完美的模仿 HTML5 localStorage API
store.js 和 AmplifyJS 存储模块提供了很大范围的旧浏览器兼容支持

  • Modernizr
    Modernizr 是一个 JavaScript 库,用于检测用户浏览器的 HTML5 与 CSS3 特性。它内建了 html5shim 功能。
发布了76 篇原创文章 · 获赞 9 · 访问量 6万+

猜你喜欢

转载自blog.csdn.net/github_38928905/article/details/102793596
今日推荐