前端開發須要瞭解的JS插件

excanvas.js/Chart.js/cubism.js/d3.js/dc.js/dx.chartjs.js/echarts.js/flot.js

      用途：構建數據統計圖表，兼容多瀏覽器

jquery.tagcanvas.js

      用途：構建tag雲

      下載地址：http://www.goat1000.com/tagcanvas.php

jquery.fullPage.js

     用途：網站整屏輪番

     下載地址：http://www.jq22.com/jquery-info1124

     案例：http://www.dowebok.com/77.html

analytics.js/ga.js

     用途：谷歌廣告分析

edge.js    

     用途：js和.net相互調用。

     案例：http://www.cnblogs.com/shanyou/p/3325249.html

bower.js

     用途：包管理器

     案例：http://blog.csdn.net/chszs/article/details/8907577

gulp.js

     用途：js/css壓縮

     案例：http://www.cnblogs.com/code/articles/4103070.html

jshint.js

      用途：js編寫格式驗證工具

alertify.js/simplemodal.js

     用途：構建提示框

amd.loader.js/Require.js/Sea.js/Head.js

     用途：按需動態加載js文件

Behave.js/epiceditor.js

     用途：編輯器，使textarea具備IDE編輯能力

bonsai.js/caman.js/canvas.js/fabric.js/paper.js/raphael.js/sigma.js

     用途：圖形處理

bucky.js

     用途：前端測試自動化工具+頁面性能分析工具

chosen.js

    用途：選擇框插件 

classlist.js

    用途：操做DOM

Cookies.js

    用途：操做Cookie

crossfilter.js/Lodash.js/Underscore.js

    用途：用來過濾json數據，相似sql

cryptico.js

    用途：數據加密

curl.js

    用途：使圖片產生捲曲效果

date.format.js

    用途：日期格式化

dojo.js

    用途：DHTML開源包 ，有統一的UI控件

draggabilly.js

    用途：實現拖拽功能

dropzone.js

    用途：拖拽上傳

easyXDM.js

    用途：js跨域訪問

ember-data.js

    用途：使用一個模型庫來管理查詢、更改和將更改保存回服務器，將會大大的簡化代碼，同時也能提高應用的健壯性和性能，這便產生了Ember-Data數據模型。

equalize.js

    用途：內容對其插件 例如：百度關鍵詞標籤

Faker.js

    用途：虛假數據生成器

fancybox.js/layer.js

    用途：彈出層展現插件

fastclick.js

    用途：觸摸UI上的消除點擊延遲js庫

favico.js 

    用途：圖片上實現動畫角標

 FitText.js

    用途：FitText.js是一款經典的jQuery響應式標題文字插件。FitText.js能夠將標題文字自適應容器的大小，縮放容器時標題字體大小隨之改變。FitText.js可用於桌面設備、手提電腦、平板電腦和手機等衆多設備，很是強大。

floatlabels.js

   用途：jquery浮動標籤floatlabels.js在輸入文本框鍵入任何行動中看到漂浮的標籤。它對一個輸入字段佔位符值移動用戶交互，並鍵入文本上方顯示，容許用戶自定義標籤樣式、效果。

lightGallery.js/Lighterbox.js/Rebox.js/LiteBox.js/Image Lightbox.js/TosRus.js/Fluidbox.js/Swipebox.js/iLightbox.js/VenoBox.js/Magnific Popup.js/Featherlight.js/flipLightBox.js/Colorbox.js/Lightbox_me.js/Shadowbox.js/Superbox.js/Lightview.js

 用途：燈箱插件

frozenui.css 

用途：移動端前端框架

galleriffic.js

用途：圖片相冊展現

garlic.js

用途：可讓你自動的持久化表單中的數據到本地，直到表單被提交。這樣用戶就不用擔憂由於誤操做致使表單輸入的數據丟失。

AudioPlayer.js/GrindPlayer.js/GrindPlayerCN.js/muplayer.js

用途：播放器

modernizr.js

用途：傳統瀏覽器目前不會被徹底取代，令你難以將最新的 CSS3 或 HTML5 功能嵌入你的網站。 Modernizr 正是爲解決這一難題應運而生，做爲一個開源的 JavaScript 庫，Modernizr 檢測瀏覽器對 CSS3 或 HTML5 功能支持狀況。 Modernizr 並不是試圖添加老版本瀏覽器不支持的功能，而是令你經過建立可選風格配置修改頁面設計。 它也能夠經過加載定製的腳原本模擬老版本瀏覽器不支持的功能。

hallo.js

用途：一款所見即所得的web編輯器

Hammer.js/quo.js/swipe.js

用途：hammer.js是一款開源的移動端腳本框架，他能夠完美的實如今移端開發的大多數事件，如：點擊、滑動、拖動、多點觸控等事件。

handsontable.js

用途：web版excel

Headroom.js

用途：一個輕量級、高性能的JS小工具（不依賴任何工具庫！），它能在頁面滾動時作出響應。此頁面頂部的導航條就是一個鮮活的案例，當頁面向下滾動時，導航條消失，當頁面向上滾動時，導航條就出現了。

history.js

用途：無刷新就可改變瀏覽器欄地址的插件（不依賴jquery）

holder.js

用途：徹底在客戶端上呈現圖像佔位符。在線和離線工做，並提供一個可連接的API的風格和輕鬆的建立佔位符。在線和離線工做，並提供一個可連接的API的風格和輕鬆的建立佔位符。

Pikaday.js

用途：這是一個使人耳目一新的JavaScript日期選擇器。輕量輕（壓縮和gzip後小於5KB），沒有依賴其它JS框架(但可以與Moment.js一塊兒使用)，模塊化的CSS類，方便

Mailcheck.js

用途：個Javascript庫和jQuery插件，用於檢測email地址的域名。當域名不正確時，會提供相應的建議。

Lenticular.js

用途：一個jQuery插件用於建立圖片動畫，可響應傾斜或鼠標事件。這個插件主要用於移動瀏覽器（傾斜傾斜設備），但也能夠用於桌面瀏覽器（鼠標控制）。

Jarallax.js/skrollr.js

用途：頁面實現視差滾動

jsPDF.js

用途：JS實現生成pdf

oriDomi.js

用途：使dom元素實現摺疊效果

Mousetrap.js/Keymaster.js

用途：用於建立和管理鍵盤快捷鍵。這個JS是一個單獨的JS包，很是小隻有1.6kb。支持大部分瀏覽器包括IE6。它能夠實現單鍵，組合鍵或一個序列組合鍵。此外還能夠監聽keypress, keydown 或 keyup事件,而後據此決定觸發哪一個函數。

humane.js

用途：一個簡單、現代、無需其餘框架支持的網頁上的提醒庫，使用 CSS 進行定製，支持手機使用。

imagesloaded.js

用途：imagesLoaded是一款用於檢測頁面中的圖片是否被加載的js插件。imagesLoaded是很是有用的插件，當你的頁面中某幅圖片沒有被加載時，默認會顯示一個紅叉或圖片alt文本，imagesLoaded能夠將未加載的圖片替換爲你設置的圖片。

instantclick.js

用途：讓你的頁面提早加載200ms

intro.js

用途：js引導插件。 例如：你的網站你增長了某個功能，那麼能夠經過這個插件引導改動點。

jquery-scrollUp.js

用途： ScrollUp是一個輕量級的Jquery插件，它建立一個可自定義的「滾動到頂部」的按鈕，在任意的網站中進行簡單的調用就能達到效果

jquery.infinitescroll.js

用途：它是基於Jquery的，另外還要明白無限滾動的概念：無限滾動的實現原理就是當你在網頁上的滾動條滾動到離網頁底部必定長度的時候，觸發某ajax函數（infinite-scroll內已經封裝好）,日後臺加載文件或者數據，又或者從外部引入靜態html形式文件。

jquery.url.js

用途：很方便地對URL進行操做。

justgage.js

用途：JS儀表盤。

Moment.js

用途：日期格式化，支持多國語言

nprogress.js

用途：進度條

Odometer.js

用途：計時器效果

opentip.js/pnotify.js/qtip2.js

用途：示框插件，支持多種樣式風格。

owl-carousel.js/sequence.js/slides.js/reveal.js

用途：幻燈片插件。

pace.js
用途：頁面加載進度條，支持ajax.

parallax.js

用途：簡單，輕量級的的視差引擎，智能設備的方向做出反應。凡沒有陀螺儀或運動檢測硬件是可用的，光標的位置來代替。

piecon.js/tinycon.js

用途：可以動態生成餅圖（Pie Charts）模式的網頁圖標，同時能夠顯示加載的百分比.

recorder.js

用途：錄音框架。

select2.js/selectize.js

用途：強大dropdown 插件，支持tag/分類。

shine.js

用途：文字陰影，支持動畫。

swfobject.js

用途：只須要包含 swfobject.js這個js文件，而後在DOM中插入一些簡單的JS代碼，就能嵌入Flash媒體資源了

timeline.js

用途：超酷全屏時間軸幻燈片，時間軸可放大縮小，須要在服務器環境下運行，可用本地服務器環境測試。

ueditor.js/FCK

用途：百度網頁內容編輯器。

jquery.lazyload.js/unveil.js

用途：圖片延時加載。

video.js

用途：視頻播放器，支持html5以及flash。

wow.js

用途：有的頁面在向下滾動的時候，有些元素會產生細小的動畫效果。雖然動畫比較小，但卻能吸引你的注意。

zeroclipboard.js

用途：複製到剪貼板，自制粘貼。

 

Rotate.js  

用途：旋轉插件 圖片360旋轉

近期剛上線一門基於微信小程序、公衆號和小程序雲開發的微信受權、分享和支付的專項課程，若是你對支付感興趣能夠考慮入手：

https://coding.imooc.com/class/343.html

React全家桶開發通用的後臺管理系統：

https://coding.imooc.com/class/236.html

Vue2.0+Vue-Router+Vuex+Node+Mongo開發全棧商城課程

https://coding.imooc.com/class/113.html

慕課講師：河畔一角

講師地址：http://www.imooc.com/u/1343480