链接:https://zhuanlan.zhihu.com/p/24598210
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
回顾今年已发布的 JS 框架和库,我们针对地筛选了一些能够提供直接和具体功能的免费 JavaScript 插件和库,与大家分享。它们可不是臃肿的一站式框架,而是一些轻量级,并能够帮助你更快、更容易地进行网页设计与开发的实用型框架。
正如你期望的,文中的一些插件可用来创建滑块、图片库、响应式菜单、弹出式窗口以及许多其他常见的组件。同时,你也可以发现一些能够提供独特功能的插件,像旁注工具、GIF 预览、动画图标等。
或许,你可能还想了解下 2015 年 50 个最佳的 JavaScript 集合,以及 50 个最佳的免费 jQuery 插件。
1. Choreographer-js
![](https://pic2.zhimg.com/v2-ddba4bb19c67399531fa855cc64e8a55_b.jpg)
2. Leaflet.js
![](https://pic4.zhimg.com/v2-b6c056175c40eb2f0af193ca091082c3_b.jpg)
3. Lory
![](https://pic3.zhimg.com/v2-73c4e02e6c467cedc53f20a666eff05a_b.jpg)
4. CurrencyFormatter.js
![](https://pic1.zhimg.com/v2-199733b3c6ab4a7ef035942ff197efbc_b.jpg)
5. Arc
![](https://pic2.zhimg.com/v2-56bb515415a7d6b429acd37403b161a5_b.jpg)
6. Egjs
![](https://pic4.zhimg.com/v2-cdb94bedc03692095edfeea94b779ddb_b.jpg)
Egjs 是一个基于 jQuery 的具备 UI 交互,效果和实用程序的小型组件库。
7. Shave.js
![](https://pic4.zhimg.com/v2-2f8c4f189282110e1f6e88a86f95c4d3_b.jpg)
Shave 是一个用于截断 Html 元素中文本的现代 JavaScript 插件。
8. Next.js
![](https://pic4.zhimg.com/v2-a16c8ed5f4725076b57bd3b094fe5593_b.jpg)
Next.js 是一个用于服务器渲染 React 应用程序的简约框架。
9. jQuery Linechart
![](https://pic2.zhimg.com/v2-2527239a949fa40f4d7468ae02dee251_b.jpg)
10. Blueprint
![](https://pic3.zhimg.com/v2-d7b25132ffeffe4914a7b53f4874f476_b.jpg)
Blueprint 是 React UI 组件的集合,它涵盖了 Web 上的常见界面元素、模式以及交互。
11. Tabulator
![](https://pic3.zhimg.com/v2-bc2041ae15b61e18452bf6c6a94200f2_b.jpg)
Tabulator 是一个易用的交互式 jQuery 表单生成插件。
12. baguetteBox.js
![](https://pic2.zhimg.com/v2-40f96f6ce879147df01ec3e66c49913d_b.jpg)
13. ScrollReveal
![](https://pic3.zhimg.com/v2-fd3029d6946e55285a8f9ea0522c1b6a_b.png)
无论是为桌面,或是移动浏览器,ScrollReveal 插件都可以轻松、快速的帮助你为其创建页面滚动显示动画。
14. Marginotes
![](https://pic1.zhimg.com/v2-12ce3e0263d2d11255d7951bece41d98_b.jpg)
Marginotes 是一款使用 jQuery 实现的添加旁注插件。它能够使用 HTML 属性中提供的文本向边距添加相应的注释。如果 jQuery 不是你的“菜”,它还有个不含 jQuery 的版本。
15. Loud Links
![](https://pic1.zhimg.com/v2-681e87a9c1e05ab24414952dfbd44cac_b.png)
Loud Links 是一个轻量级 JavaScript 库,用于向您的网站添加交互音频。它通过创建 HTML5 音频元素,来播放 MP3 或 OGG 格式的音频文件。
16. Bricks.js
![](https://pic1.zhimg.com/v2-d34d09641aea33271f348e1d80cebe30_b.jpg)
Bricks.js 是一个用于固定宽度元素的快速堆砌布局生成器。
17. MediumEditor
![](https://pic1.zhimg.com/v2-d5425b32348db3b03252c24e2a665290_b.jpg)
18. Philter
![](https://pic3.zhimg.com/v2-1d2dbc26f7cc2f211c00f7e08aadb446_b.png)
无论是作为一款 jQuery 插件或是 Vanilla JS 框架,Philter 均提供了通过 HTML 属性来控制 CSS 滤镜的方法。
19. SuperEmbed.js
SuperEmbed.js 是一个 JavaScript 库,它可检测出网页上的内嵌视频(涉及 YouTube、Vimeo、Vine、VideoPress、DailyMotion 等)并使他们变成响应式元素。
20. Substance
![](https://pic4.zhimg.com/v2-dfb039da7960ae5335509cc615fc2b8b_b.png)
Substance 是一个基于 Web 内容编辑的 JavaScript 库。它为你提供了创建自定义文本编辑器,以及基于 Web 发布系统所需的所有工具。
21. List.js
![](https://pic1.zhimg.com/v2-f86c3552e20d6113428cb0a785b7fb74_b.png)
22. jqGifPreview
![](https://pic1.zhimg.com/v2-269e7f8dacf1d23cc26a964800aba458_b.png)
23. Datedropper.js
![](https://pic3.zhimg.com/v2-a3c41f9bad7bca792249c318ef7d3b96_b.jpg)
24. jfMagnify
![](https://pic3.zhimg.com/v2-46861358c64ad58e3a0631d10792ac46_b.jpg)
25. jQuery formBuilder
![](https://pic4.zhimg.com/v2-5659cfab224d072cb718664dc20209db_b.jpg)
26. Popper.js
![](https://pic3.zhimg.com/v2-67a6165d04a1e09b68a67837fded1caa_b.jpg)
27. Image Blur Plugin
![](https://pic2.zhimg.com/v2-1b74b4aaaf7186948d453362fcb137bd_b.jpg)
Image Blur Plugin 是一个轻量级用于图像模糊的跨浏览器 jQuery 插件。
28. InlineTweet.js
InlineTweet.js 能帮助你轻松地从网页的任何文本上,创建推特表格的分享。而你只需要在带有data-inline-tweet的容器中填好推特的分享文本即可。
29. iMissYou.js
![](https://pic4.zhimg.com/v2-a94d7fe67c55b494850bb5b2932d2b07_b.jpg)
30. SweetAlert2
![](https://pic2.zhimg.com/v2-7c6c890cb6e18e91d176821764e68c49_b.jpg)
31. Turntable.js
![](https://pic1.zhimg.com/v2-b32e285f0dc77a2b4d632c26efac8ab0_b.jpg)
32. Force.js
![](https://pic2.zhimg.com/v2-b75b0b9c0f47890c1490367d96bd2749_b.jpg)
33. Push.js
Push.js 是一个用于启动和运行 Javascript 桌面通知的跨浏览器解决方案。
34. Bideo.js
![](https://pic2.zhimg.com/v2-155d19b130cb1cc8de0579a83bab6c49_b.jpg)
35. Microlight.js
![](https://pic1.zhimg.com/v2-057a9b0efd08c1e81c35f6cb9c0f7f0c_b.jpg)
36. Algolia Places
![](https://pic1.zhimg.com/v2-46c0475327f31844f3de2afa22e77f4c_b.jpg)
37. Flatpickr
![](https://pic4.zhimg.com/v2-7b1fcd90827745cb8411640efd64865b_b.jpg)
38. Slidebars
![](https://pic2.zhimg.com/v2-b1423b5d5ba010cb9f14582d68ec4d91_b.jpg)
39. anime.js
![](https://pic4.zhimg.com/v2-427a9e7de972be1f947e02480c6c51bf_b.jpg)
40. Cleave.js
![](https://pic4.zhimg.com/v2-87389e79c1e8e34858ff305e06e4083f_b.jpg)
41. Skippr
![](https://pic3.zhimg.com/v2-661a7961b4191c3e0f7d01b622f4f6da_b.jpg)
Skippr 是一个超简单、轻量级的 jQuery 幻灯片插件。
42. iziModal.js
![](https://pic2.zhimg.com/v2-b6ce54daee51bbd74d2ab1efa6ea665d_b.jpg)
43. Lightgallery.js
![](https://pic3.zhimg.com/v2-144271f20d6a1b5b8c193cd65e1cee72_b.jpg)
以上就是本文的分享,那么还少了 7 个框架,它们去哪里了?
鬼知道!!一脸懵逼(/ □ )...
那么,程小狮就将其补全吧!
44. Progressively
![](https://pic4.zhimg.com/v2-f7be1d5e054db0a2924d931a2937433f_b.jpg)
45. Features.js
![](https://pic3.zhimg.com/v2-fd5d02bc917f7017c5b3f7c623a5cefe_b.jpg)
Feature.js 是一个快速、简单、轻量级的浏览器功能检测库。它没有任何的依赖,并且 gzip 压缩后仅有1kb.
46. UAParser.js
![](https://pic3.zhimg.com/v2-9a6a5cd9f802d64b4df38d636befaeaa_b.jpg)
47. Monkberry
![](https://pic1.zhimg.com/v2-e12a18d5c3a8440db91ce987717eb540_b.jpg)
Monkberry 是一个快速,小巧(1kb)的用于构建 Web 用户界面的 JavaScript 库 。
48. viewScroller.js
![](https://pic4.zhimg.com/v2-ae575c5e507889ce47602055672fff67_b.jpg)
viewScroller.js 是一个小巧易用的解决方案,它可以帮助你创建全页滚动网站。
49. Appmetrics.js
![](https://pic1.zhimg.com/v2-406a8acce63539493379e546bd72e630_b.jpg)
Appmetrics.js 是一个用来测量 Web 应用程序的小型 JS 库,并把结果报告发送到 Google Analytics 上。
50. Senna.js
![](https://pic4.zhimg.com/v2-268f22d6c259ac42f27a0e1c9b66126f_b.jpg)
Senna.js 是一个轻量级、快速的单页面应用程序引擎,它提供了几个低级的API,你可以借助它来构建现代的 Web 应用程序。同时,它压缩后的大小只有 15 KB,没有任何依赖。