# PracticeFronted

**Repository Path**: unix_xiaobin/practice_fronted

## Basic Information

- **Project Name**: PracticeFronted
- **Description**: HTML、CSS、JavaScript、JQuery、VUE前端开发学习总结，以及400+多款常用的前端开发插件总结。
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://gitee.com/SteveRocket/
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 5
- **Created**: 2023-11-15
- **Last Updated**: 2023-11-15

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# ABOUT

**【关于我们】**

* [Articulate v1.0](https://mp.weixin.qq.com/s/0yqGBPbOI6QxHqK17WxU8Q)
* [Articulate v2.0](https://mp.weixin.qq.com/s/V5Axn-ZWi22ubh5Jiocb9g)

[![](https://img.shields.io/badge/GitHub-zrf--rocket-blue?logo=gitpod)](https://github.com/zrf-rocket)
[![](https://img.shields.io/badge/Gitee-SteveRocket-pink)](https://gitee.com/SteveRocket/)
![CTO Plus](https://img.shields.io/badge/微信公众号：CTO%20Plus-8A2BE2) 🥰

## Contact

![微信公众号](./static/wechat.png)  
**< 微信公众号 >**

![QQ技术交流群](./static/qq_link.png)  
**< QQ技术交流群 >**

![联系作者](./static/wechat.jpg)  
**< 联系作者 >**

## **【代码工程系列】**

* [Python和Go的设计模式](https://github.com/zrf-rocket/DesignPattern)
    * GitHub：https://github.com/zrf-rocket/DesignPattern
    * Gitee：https://gitee.com/SteveRocket/design_pattern

* [Python、Go的编码技巧cookbook](https://github.com/zrf-rocket/CookBook)
    * GitHub：https://github.com/zrf-rocket/CookBook
    * Gitee：https://gitee.com/SteveRocket/cook-book

* [Go代码示例](https://github.com/zrf-rocket/PracticeGo)
    * GitHub：https://github.com/zrf-rocket/PracticeGo
    * Gitee：https://gitee.com/SteveRocket/practice_go

* [Python代码示例](https://github.com/zrf-rocket/PracticePython)
    * GitHub：https://github.com/zrf-rocket/PracticePython
    * Gitee：https://gitee.com/SteveRocket/practice_python

* [Python Web框架的示例代码](https://github.com/zrf-rocket/PythonFramework)
    * GitHub：https://github.com/zrf-rocket/PythonFramework
    * Gitee：https://gitee.com/SteveRocket/python_framework
    * Django：https://github.com/zrf-rocket/PythonFramework/tree/master/django_framework
    * Flask：https://github.com/zrf-rocket/PythonFramework/tree/master/flask_framework

* [Python 爬虫框架和技术](https://github.com/zrf-rocket/PracticeSpider)
    * GitHub：https://github.com/zrf-rocket/PracticeSpider
    * Gitee：https://gitee.com/SteveRocket/practice_spider

* [Rust代码示例](https://github.com/zrf-rocket/PracticeRust)
    * GitHub：https://github.com/zrf-rocket/PracticeRust
    * Gitee：https://gitee.com/SteveRocket/practice_rust

* [Vue代码示例](https://github.com/zrf-rocket/PracticeVue)
    * GitHub：https://github.com/zrf-rocket/PracticeVue
    * Gitee：https://gitee.com/SteveRocket/practice_vue

* [前端代码示例](https://github.com/zrf-rocket/PracticeFronted)
    * GitHub：https://github.com/zrf-rocket/PracticeFronted
    * Gitee：https://gitee.com/SteveRocket/practice_fronted

* [Python自动化测试框架](https://github.com/zrf-rocket/PythonTestAutomationFramework)
    * GitHub：https://github.com/zrf-rocket/PythonTestAutomationFramework
    * Gitee：https://gitee.com/SteveRocket/python_test_automation_framework

* [Python和Go的算法代码示例](https://github.com/zrf-rocket/Algorithms)
    * GitHub：https://github.com/zrf-rocket/Algorithms
    * Gitee：https://gitee.com/SteveRocket/Algorithms

* [Python和Go的数据结构代码示例](https://github.com/zrf-rocket/DataStructure)
    * GitHub：https://github.com/zrf-rocket/DataStructure
    * Gitee：https://gitee.com/SteveRocket/data_structure

* [编码规范](https://github.com/zrf-rocket/DevGuide)
    * GitHub：https://github.com/zrf-rocket/DevGuide
    * Gitee：https://gitee.com/SteveRocket/develop_guide

* [编码安全规范](https://github.com/zrf-rocket/SecGuide)
    * GitHub：https://github.com/zrf-rocket/SecGuide
    * Gitee：https://gitee.com/SteveRocket/security_guide

## **【产品系列】**

* [主机监控系统-日志收集与报警管理系统（SIEM）](https://github.com/zrf-rocket/SIEM)
    * GitHub：https://github.com/zrf-rocket/SIEM
    * Gitee：https://gitee.com/SteveRocket/siem

* [安全运营中心（SOC）-终端侦测与响应系统（EDR）](https://github.com/zrf-rocket/EDR_SOC)
    * GitHub：https://github.com/zrf-rocket/EDR_SOC
    * Gitee：https://gitee.com/SteveRocket/edr_soc

* [安全运营中心（SOC）-信息资产采集与安全评估系统（ICSA）](https://github.com/zrf-rocket/SOC_ICSA)
    * GitHub：https://github.com/zrf-rocket/SOC_ICSA
    * Gitee：https://gitee.com/SteveRocket/SOC_ICSA

* [DevSecTestOps-SDLC-自动化研发安全测试运维一体化平台（DevSecTestOps）](https://github.com/zrf-rocket/DevSecOps-SDLC)
    * GitHub：https://github.com/zrf-rocket/DevSecOps-SDLC
    * Gitee：https://gitee.com/SteveRocket/dev-sec-ops-sdlc

* [Penetration Test-自动化渗透测试平台（PT）](https://github.com/zrf-rocket/PenetrationTest)
    * GitHub：https://github.com/zrf-rocket/PenetrationTest
    * Gitee：https://gitee.com/SteveRocket/penetration_test

* [cicd-持续集成持续部署系统（CI/CD）](https://github.com/zrf-rocket/CICD)
    * GitHub：https://github.com/zrf-rocket/CICD
    * Gitee：https://gitee.com/SteveRocket/cicd

* [AI图像识别-智能缺陷检测系统]()
    * [基于AI图像识别的工业缺陷检测应用系统（GPU&FPGA）](https://mp.weixin.qq.com/s/04qefQFg-Pg1Gcqq1vBLQQ)
    * [基于AI图像识别的智能缺陷检测系统，在钢铁行业的应用-技术方案](https://mp.weixin.qq.com/s/dSHbnuOwQZzE4CvPr1JYjg)

# 前端开发技能总结

## 工程目录结构

* angular [AngularJS的知识学习内容]()

* frontend_plugs_libs [前端常用插件库和工具合集 400+]()
* html_css
    * H5   [H5技术开发知识点](html_css/H5)
    * CSS3   [CSS3技术开发知识点](html_css/CSS3)
* javascript
    * es6 [es6新特性](javascript/es6)
    * es7 [es7新特性](javascript/es7)
    * es8 [es8新特性](javascript/es8)
    * es9 [es9新特性](javascript/es9)
    * keywords [JavaScript的所有关键字代码示例](javascript/keywords)
* jquery
* node.js
* react
* ts
* vue
    * vue2
    * vue3
    * applet_pro 基于vue的小程序开发技术点
* HBuilder 移动端开发技术点
* uniapp 移动端开发技术点
* flutter 移动端开发技术点

*_特别注意：_ 此处插件库排序按照字母排序。插件分类维度见这里：[插件集合分类](README%20Plugin%20Category.md)*

## html_css [HTML](html_css/README%20HTML%20Object.md)/[CSS](html_css/README%20CSS.md)的知识学习总结内容

## javascript [JS](javascript/README.md)的知识学习总结内容

## jQuery [JQuery的知识学习内容](jquery/README.md)

## nodejs [NodeJS的知识学习内容](nodejs/README.md)

## react [ReactJS的知识学习内容](react/README.md)

## ts [TypeScript的知识学习内容](ts/README.md)

## vue [VUE的知识学习内容](vue/README.md)

# <a name="browser-strong">前端开发插件库和工具集</a>

## 测试

* 测试框架
    * [Jest](https://jestjs.io/)
    * Mocha
    * [性能测试](https://benchmarkjs.com/)
* 断言库
    * [Power Assert](https://github.com/power-assert-js/power-assert)
    * Chai
    * Should
* Snoion
* [DeviceMock.js](http://rm-labo.com/labo/devicemock/) mock 设备。
* 端到端测试
    * Puppeteer
    * [BackstopJS](https://github.com/garris/BackstopJS)
    * 录制浏览器交互并生成测试脚本
        * [Puppeteer Recorder](https://github.com/checkly/puppeteer-recorder) 生成 Puppeteer 的。
        * [softest](https://github.com/prprprus/softest/blob/master/README-zh.md) 基于 Puppeteer 构建的。支持多 Tab，截图等 Puppeteer Recorder 不支持的功能。

## 数据可视化(图表)

* [F2](https://github.com/antvis/f2/blob/master/README.zh-CN.md) 阿里出品。为移动端而生。
* [Plottable.JS](http://plottablejs.org/) 基于D3的一个图表库
* [flot](http://www.flotcharts.org/) 文档不给力
* [chartJs](http://www.chartjs.org/) [中文文档](http://www.bootcss.com/p/chart.js/docs/)  demo很漂亮，很清晰。比较轻量级。
* [ichartJs](http://www.ichartjs.com/) 中国的一个家伙搞的，感觉还不错。
* k线图(k line)
    * [Echarts的k线图](http://echarts.baidu.com/echarts2/doc/doc.html#K) 功能比较简单
    * [kline](https://github.com/chxj1992/kline) 功能比较多，支持 webpack 等。
* 流程图&脑图
    * [GGEditor](https://ggeditor.com/zh-CN) 基于 G6 和 React 的可视化图编辑器。支持流程图和脑图。阿里出品。

## UI 框架

* [WeUI](https://github.com/weui/weui) 由微信官方设计团队为微信 Web 开发量身设计。
* [SUI Mobile](https://github.com/sdc-alibaba/SUI-Mobile) 阿里巴巴国际UED前端出品的移动端UI库。
* [Framework7](http://framework7.io/)
* [UIKit](https://getuikit.com/) Web 组件库，不依赖任何框架，组件类型多、功能强。
* [wired elements](https://github.com/wiredjs/wired-elements) 手绘效果的组件库。它的底层是 Web components。

## UI组件类

### 拖拽

* [dragula](https://github.com/bevacqua/dragula) 支持Draggable，Dropable和Sortable。感觉比jqueryUI的轻量级，好用的样子
* [angular-dragula](http://bevacqua.github.io/angular-dragula/) dragular 官方的 angular 版本
* [vue-grid-layout](https://github.com/jbaysolutions/vue-grid-layout) 支持托拽和自定义大小网格系统。

## 小程序

* 其他框转小程序(转译型框架)
    * [mpvue](http://mpvue.com/) 美团出品。 Vue 转微信小程序、百度智能小程序、头条小程序 和 支付宝小程序。
    * [WePY](https://github.com/Tencent/wepy) 类 Vue 写法转 小程序。
    * [Taro](https://github.com/NervJS/taro) 京东出品。React 转生成能运行在微信/百度/支付宝/字节跳动小程序、H5、React Native 等的应用。
    * [Chameleon](https://cmljs.org/doc/) 滴滴出品的不同环境的跨端整体解决方案。
    * [uniapp](https://uniapp.dcloud.io/) DClound出品。生成 App，小程序，H5。
    * [graceUI](http://grace.hcoder.net/) 可生成 uniapp 和 小程序代码。小额收费。
* 增强型小程序框架
    * [MPX](https://didi.github.io/mpx/) 滴滴出品。致力于提高小程序开发体验的增强型小程序框架，通过Mpx，我们能够最先进的web开发体验(Vue + Webpack)来开发生产性能深度优化的小程序
* 组件库
    * [iView webApp](https://weapp.iviewui.com/) Talking Data 出品。
    * [MinUI](https://meili.github.io/min/index.html) 蘑菇街出品。
    * [zanui-weapp](https://github.com/youzan/zanui-weapp) Vant UI 的小程序版。有赞出品。

## 浏览器增强类

### 让一些旧浏览器增强

* [Selectivizr](https://github.com/keithclark/selectivizr)  让IE 6-8一些的css3选择器
* [ieBetter](https://github.com/zhangxinxu/ieBetter.js) 让ie6-8有高级浏览器的特性
* [ExplorerCanvas](https://github.com/arv/ExplorerCanvas) 让IE8-的浏览器支持canvas
* [CSS3 Pie](http://css3pie.com/) 让IE6-9支持border-radious,box-shadow,linear-gradient。 可以使用.htc文件（注意Mine type）或.js文件。在用Pie.js时，box-radious的元素有背景色时，不显示背景色。。。
* [formFive](http://etiennetalbot.github.io/formFive/) 让旧的浏览器支持HTML5表单的一些特性，如 placeholder,autofocus
* [https://github.com/anselmh/object-fit](https://github.com/anselmh/object-fit) 让浏览器支持`object-fit`这css规则
* [HTML5 Cross Browser Polyfills](https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills) 一堆Polyfills
* [flexibility](https://github.com/jonathantneal/flexibility) 让旧的 IE 也支持 Flexbox

## 前端开发工具合集

[前端开发工具合集](README DevTools.md)

## Node.js开发插件库

[Node.js开发插件库](nodejs/README_plugins.md)

## VUE的前端开发插件

[VUE常用前端插件](https://gitee.com/SteveRocket/practice_vue/blob/master/README_plugins.md)

## React的前端开发插件

[React常用前端插件](react/README_plugins.md)

## JavaScript日常前端开发插件

### [accessible-html5-video-player]()

Paypal 出品的 Video 播放器。

### [accounting.js]()

轻量级的数字、货币转换库。

### [ace](https://ace.c9.io/)

[GitHub地址：](https://github.com/ajaxorg/ace.git) https://github.com/ajaxorg/ace.git   
[下载地址](https://github.com/ajaxorg/ace-builds.git) https://github.com/ajaxorg/ace-builds.git

* 代码编辑器，Ace(基于浏览器的编辑器)是透过JavaScript所开发的线上程序语言编辑器插件，无论功能和性能都类似一般编辑器（Sublime、Vim和TextMate等），导入进任何网页或JavaScript应用程序都相当容易。
* Ace是由Cloud9 IDE的团队维护，并且是Mozilla Skywriter（Bespin）项目的延伸品，品质值得信赖。

特点：

1. 超过120种语言的语法突出显示（可导入TextMate/Sublime/.tmlanguage 文件）。
2. 超过20个主题（可导入TextMate/Sublime/.tmtheme文件）。
3. 自动缩进和突出。
4. 可选的命令行。
5. 处理大量文件（最后检查，4,000,000 行是上限）。
6. 完全可定制的键绑定，包括VIM和Emacs模式。
7. 搜索并替换正则表达式。
8. 突出显示匹配的括号。
9. 在软标签和真实标签之间切换。
10. 显示隐藏的字符。
11. 使用鼠标拖放文本。
12. 换行。
13. 代码折叠。
14. 多个游标和选择。
15. 实时语法检查器（目前是 JavaScript / CoffeeScript / CSS / XQuery）。
16. 剪切，复制和粘贴功能。

### [Ace admin](http://ace.jeka.by/)

[GitHub地址：](https://github.com/bopoda/ace) https://github.com/bopoda/ace    
Ace Admin是一款轻量且功能丰富的管理模板，干净且易于使用。

特点：

1. 4种不同的皮肤。
2. 基于Bootstrap 3的响应式设计（特别是3.1.1）。
3. 使用Javascript和CSS构建器来构建您自己的最小文件。
4. 在页面帮助中，您可以轻松选取任何元素并查看其工作原理。
5. 自定义元素和插件。
6. Bootstrap，jQuery UI和第三方插件和元素。

### [AdminLTE]()

[GitHub地址：](https://github.com/almasaeed2010/AdminLTE) https://github.com/almasaeed2010/AdminLTE

* 免费皮肤。

### [alertify.js](https://fabien-d.github.io/alertify.js/)

[Github地址：](https://github.com/fabien-d/alertify.js.git) https://github.com/fabien-d/alertify.js.git

alertify.js是为了美化通知信息而生的JavaScript框架。

### [amp-what](http://www.amp-what.com/) HTML字符实体图标

### [animatable]()

仅仅依靠 border-width 和 background-position 实现的各种动态效果。

### [Animate.css](https://animate.style/)

[Github地址：](https://github.com/animate-css/animate.css.git) https://github.com/daneden/animate.css 预设了很多动画。

1. 这款插件能让你的网页端拥有更加丰富的动画。纯CSS制作的动画效果的CSS集合，无需JavaScript，支持多浏览器的动画特效，即插即用。
1. animate.css把不同的动画绑定到了不同的类里，所以想要使用哪种动画，只需要把通用类animated和相应的类添加到元素上就行了。
1. 主要包括Attention(晃动效果)、bounce(弹性缓冲效果)、fade(透明度变化效果)、flip(翻转效果)、rotate(旋转效果)、slide(滑动效果)、zoom(变焦效果)、special(特殊效果)这8类

下载https://raw.githubusercontent.com/daneden/animate.css/master/animate.css  
或安装  
npm install animate.css

### [AnythingZoomer]()

[GitHub地址：](https://github.com/CSS-Tricks/AnythingZoomer/) https://github.com/CSS-Tricks/AnythingZoomer/

放大镜功能。

### [Arbiter.js](http://arbiterjs.com/)

发布订阅。

### [Async.js]()

[GitHub地址：](https://github.com/caolan/async/) https://github.com/caolan/async/

异步流程控制。

### [autosize]()

[GitHub地址：](https://github.com/jackmoore/autosize) https://github.com/jackmoore/autosize

让文本域(textarea) 的高度随着文字内容的变高而变高。

### [awesome-nodejs](https://github.com/vndmtrx/awesome-nodejs)

### [Awesomplete](http://leaverou.github.io/awesomplete/)

输入的智能提示，自动补全。非常轻型的一个自动补全 JS 库, 没有任何依赖, 配置简单, 美观

### [axios](https://www.npmjs.com/package/axios)

支持浏览器和Node.js 的HTTP请求工具。axios不支持jsonp。

### [backbone]()

强大的前端 MVC 库，鼻祖级前端库，最初为了配合 Rails 来模块化前端应用，兼容性良好 (兼容到 IE6)，插件丰富，性能良好。

### [backgrid](http://backgridjs.com/)

* 表格组件，基于Backbone.js的DataGrid。

### [bacon.js](https://baconjs.github.io/)

[GitHub地址：](https://github.com/baconjs/bacon.js/) https://github.com/baconjs/bacon.js/    
函数式编程，是一个小型 JavaScript 函数式响应编程库。

### [basket.js]()

基于LocalStorage的资源加载器，可以用来缓存script和css, 手机端使用速度快于浏览器直接缓存。

### [better scroll](https://github.com/ustbhuangyi/better-scroll)

[文档](https://ustbhuangyi.github.io/better-scroll/doc/zh-hans/) 在PC上使用时的推荐配置： `{scrollbar:true,mouseWheel: {speed: 20,invert: false}}`

### [bgstretcher](http://www.ajaxblender.com/bgstretcher-2-jquery-stretch-background-plugin-updated.html)

全屏幻灯，会随着页面大小的变化而变化。

### [BigDecimal.js](https://github.com/dtrebbien/BigDecimal.js)

提高精度的数字操作。

### [BigVideo.js]()

jQuery的一个插件, 用于实现大背景(视频、图片)效果。

### [blockUI](http://jquery.malsup.com/block/)

Lolding组件。

### [Bootbox.js](http://bootboxjs.com/)

* 对bootstrap的弹出框做的一些封装。

### [bootstrap](http://getbootstrap.com/)

[Github地址：](https://github.com/twbs/bootstrap.git) https://github.com/twbs/bootstrap.git

[Bootstrap](https://www.bootcss.com/)，来自Twitter，是一个用于快速开发 Web 应用程序和网站的前端框架，是目前最受欢迎的前端框架。Bootstrap是基于HTML、CSS、JAVASCRIPT的，它简洁灵活，使得Web开发更加快捷。

下载https://github.com/twbs/bootstrap/archive/v5.3.0-alpha1.zip  
或安装  
npm i bootstrap@5.3.0-alpha1

### [bootstrap-datepicker](http://www.eyecon.ro/bootstrap-datepicker/)

* 时间选取组件，bootstrap风格。

### [bootstrap-datetimepicker]()

时间插件，可以友好选择日期和时间。

### [bootstrap-switch]()

开关插件，用于切换状态的时候使用。

### [Bowser](https://github.com/ded/bowser)

探测具体浏览器和版本。

### [breach_core]()

Javascript 编写的 Browser (浏览器)。

### [bricks.js]()

[GitHub地址：](https://github.com/callmecavs/bricks.js) https://github.com/callmecavs/bricks.js

* 图片的瀑布流展示，高性能版 Masonry。不依赖 jQuery。

### [BuildAdmin](https://wonderful-code.gitee.io/?from=element-plus)

[GitHub地址：](https://gitee.com/wonderful-code/buildadmin) https://gitee.com/wonderful-code/buildadmin  
[用户指南：](https://wonderful-code.gitee.io/guide/) https://wonderful-code.gitee.io/guide/

使用流行技术栈快速创建商业级后台管理系统。

🚀 CRUD代码生成  
~~设计数据表，界面立成。一行命令即可直接生成数据表的增删改查代码~~，图形化拖拽生成后台增删改查代码，自动创建数据表，`大气实用的表格、多达22种表单组件支持、拖拽排序、受权限控制的编辑和删除、支持关联表等等`，可为您节省大量开发时间。[ [视频介绍]() | [使用文档]() ]

💥 内置WEB终端  
我们内置了WEB终端以实现一些理想中的功能，比如：虽然是基于vue3的系统，但你在安装本系统时，并不需要手动执行npm install和npm build命令。且后续本终端将为您提供更多方便、快捷的服务。[ [视频介绍]() | [使用文档]() ]

👍 流行且稳定的技术栈  
除了基于TP6前后端分离架构外，我们的Vue3使用了Setup、状态管理使用了Pinia、并使用了TypeScript、Vite、Element plus等可以为你的知识面添砖加瓦的技术栈。[ [相关技术学习文档]() ]

🎨 所见不只是所得  
后台模块市场还可一键安装数据导出、短信发送、云存储、单页或是纯前端技术栈的学习案例项目等等，随时随地为系统添砖加瓦，系统能够自动维护package.json和composer.json并通过内置终端自动完成模块所需依赖的安装，若您愿意成为模块开发者，模块可以：覆盖系统任何文件或为系统新增文件，您的模块经由官方审核即可上架。[ [模块开发文档]() ]

🔀 前后端分离  
web文件夹内包含：干净(不含后端代码)、完整(所有前端代码文件均在此内) 的前端代码文件，对前端开发者友好，作为纯前端开发者，您可以将BAdmin当做学习与资源的社群，本系统可为您准备好案例和模板等所需要的环境，而您只需专注于学习或工作，不需要会任何后端代码！

✨ 高颜值  
提供三种布局模式，其中默认布局使用无边框设计风格，它并没有强行填满屏幕的每一个缝然后使用边框线进行分隔，所有的功能版块，都像是悬浮在屏幕上的，同时又将屏幕空间及其合理的利用了 [ [查看在线演示]() ]

🔐 权限验证  
可视化的权限管理，然后根据权限动态的注册路由、菜单、页面、按钮(权限节点)、支持无限父子级权限分组、前后端搭配鉴权，自由分派页面和按钮权限 [ [使用文档]() ]

### [c3]()

基于D3的图表库。

### [china-area-data](https://github.com/airyland/china-area-data)

### [chosen]()

官网：Chosen Github：chosen  
Chosen是一个jQuery的插件，目的是让又长又笨重的下拉式选单变得更友善。

### [city](https://github.com/basecss/city)

* 国家行政区划分数据。从国家统计局拿的。
* [城市数据](https://github.com/basecss/city/blob/master/lib/citydata.json)

### [ckeditor](http://ckeditor.com/)

* 富文本编辑器。

### [Cleave.js]()

表单栏位格式化工具。

### [ClickSpark.js](http://www.ymc.ch/sandbox/clickspark/demo.html)

点击后的一些酷炫的效果。

### [clipboard.js](https://clipboardjs.com/)

[GitHub地址：](https://github.com/zenorocha/clipboard.js) https://github.com/zenorocha/clipboard.js  
Modern copy to clipboard. No Flash. Just 3kb gzipped.    
下载地址：https://github.com/zenorocha/clipboard.js/archive/master.zip    
复制内容到剪切板的小工具，不依赖Flash或任何臃肿的框架，大小只要3KB。

### [clone.js](https://github.com/pvorb/clone)

对各种对象的深度复制。

### [coin-slider]()

[GitHub地址：](https://github.com/kopipejst/coin-slider/) https://github.com/kopipejst/coin-slider/    
兼容IE6，不过其切换方式是一块块的。不能配置切换方式。

### [color-animation](http://www.bitstorm.org/jquery/color-animation/)

jquery的颜色渐变动画插件。jquery的动画不支持颜色值的变化。改库提供了这个支持。

### [Colorion](http://gradientbuttons.colorion.co/)

滑块/Range。背景是渐变色的按钮。hover 时有动画效果。

### [compass.js](http://ai.github.io/compass.js/)

指南针。只有在手机浏览器上才能用。

### [console-polyfill](https://github.com/paulmillr/console-polyfill/)

调试能放心的使用 console.log()之类的console方法。

### [Cookie]()

[GitHub地址：](https://github.com/ScottHamper/Cookies) https://github.com/ScottHamper/Cookies  
增删改cookie的工具库。

### [core-video-to-gif](https://github.com/JackPu/core-video-to-gif)

将视频截取为 gif 的前端 JavaScript 类库。

### [coverflow](https://github.com/quietshu/coverflow)

苹果上唱片封面的效果（Apple Cover Flow UI effect）。

### [createjs](https://createjs.com/)

* [GitHub地址：](https://github.com/CreateJS/CreateJS) https://github.com/CreateJS/CreateJS
* [下载地址：](https://codeload.github.com/CreateJS/CreateJS/zip/refs/tags/v1.0.1) https://github.com/CreateJS/CreateJS/releases
* [压缩库文件下载地址：](https://code.createjs.com/) https://code.createjs.com/  
  一套模块化库和工具，包含：easeljs、tweenjs、soundjs、preloadjs，它们一起或独立工作，通过HTML5在开放web技术上实现丰富的交互式内容。  
  CreateJS库可与所有现代桌面和移动浏览器互操作，并经过彻底测试，以在尽可能广泛的浏览器中实现性能和可靠性。

### [CSS shake](http://elrumordelaluz.github.io/csshake/)

抖动动画。

### [CSS Spinners](https://github.com/jlong/css-spinners)

加载(Loding)效果，CSS做的。

### [css3patterns](http://lea.verou.me/css3patterns/)

css3 做的可平铺纹理。浏览器兼容性不好。

### [CSSgram](https://github.com/una/CSSgram)

用CSS3的Filter实现Instagram滤镜的库。

### [cycle2](http://jquery.malsup.com/cycle2/)

普通的幻灯，竟然不支持垂直滚动。

### [cylon.js](https://cylonjs.com/)

* 机器人框架，支持35个平台。

### [d3.js](https://d3js.org/)

1. 超灵活的做数据可视化的工具。
2. “数据驱动文档”，是一个基于数据操作 DOM 的Javascript库。理解起来，D3跟jQuery 很像，不过D3是面向数据可视化的，数据驱动操作DOM；而jQuery是面向web开发的，直接操作 DOM。

### [Darkmode.js](https://github.com/sandoche/Darkmode.js)

给网站加上 dark 模式。

### [datatables](https://www.datatables.net/)

DataTables是jQuery的JavaScript函数库，目的是强化表格操作（如搜索、排序），并自动加入组件引入表格中，使用非常灵活简便。

特点：

	1、Datatables是一款jquery表格插件。它是一个高度灵活的工具，可以将任何HTML表格添加高级的交互功能。
	2、分页，即时搜索和排序。
	3、几乎支持任何数据源：DOM，javascript，Ajax 和 服务器处理。
	4、支持不同主题 DataTables, jQuery UI, Bootstrap, Foundation。
	5、各式各样的扩展: Editor, TableTools, FixedColumns….
	6、丰富多样的option和强大的API。
	7、支持国际化。
	8、免费开源。

库下载地址：http://datatables.net/releases/DataTables-1.10.12.zip  
官网地址：https://datatables.net/  
DataTables中文网：http://datatables.club/

### [date-fns](https://date-fns.org/docs/)

现代时间库。

### [datedropper]()

datedropper是微型但功能强大的jQuery时间选择器。内建风格相当活泼可爱，可增加网站的活力。

### [datejs](http://www.datejs.com/)

### [DatePicker]()

* [GitHub地址：](https://github.com/foxrunsoftware/DatePicker/) https://github.com/foxrunsoftware/DatePicker/
* 一个简单的日历

### [dateRangePicker]()

* [GitHub地址：](https://github.com/dangrossman/bootstrap-daterangepicker) https://github.com/dangrossman/bootstrap-daterangepicker
* 选取时间段。bootstrap风格。该组件依赖Twitter Bootstrap, Moment.js和jQuery。

### [day.js](https://github.com/iamkun/dayjs)

和 Moment.js 一样的API。只有2KB。

### [deepmerge](https://github.com/TehShrike/deepmerge)

深度合并数组和对象。

### [device.js]()

[GitHub地址：](https://github.com/matthewhudson/device.js/) https://github.com/matthewhudson/current-device

* Device.js makes it easy to write conditional CSS _and/or_ JavaScript based on device operating system (iOS, Android, Blackberry, Windows, Firefox OS, MeeGo, AppleTV, etc), orientation (Portrait vs. Landscape), and type (Tablet vs. Mobile).
* 一个可以检测设备类型、操作系统和方向的JavaScript库，可以让我们根据不同的设备来为其定制响应的Javascript和CSS。
* 通过操作系统（比如 iOS，安卓，黑莓，Windows，Firefox OX），方向（横屏或者竖屏），类型（平板或者移动设备），来为设备添加 CSS Class，并且它还提供了一些Javascript 函数用来判断设备。

下载地址：
或安装
npm install current-device

### [devices.css]()

[GitHub地址：](https://github.com/marvelapp/devices.css) https://github.com/marvelapp/devices.css

* 移动设备边框的外观。做原型的时候用不错。

### [director](https://github.com/flatiron/director)

前端路由库。

### [dotdotdot](https://github.com/FrDH/jQuery.dotdotdot)

文字溢出时，添加在文字末尾加省略号。

### [download](https://github.com/kevva/download)

实现下载的库。支持url和流。

### [DropKick](http://robdel12.github.io/DropKick/)

下拉框，单，多选。外观比uniform好。表单元素美化。

### [easeljs](https://createjs.com/easeljs)

* [GitHub地址：](https://github.com/CreateJS/EaselJS) https://github.com/CreateJS/EaselJS
* [下载地址：](https://codeload.github.com/CreateJS/EaselJS/zip/refs/tags/1.0.0) https://createjs.com/downloads
* [压缩库文件下载地址：](https://code.createjs.com/) https://code.createjs.com/  
  一个JavaScript库，可以轻松使用HTML5画布元素。用于创建游戏、生成艺术和其他高度图形化的体验。  
  EaselJS为使用HTML5画布处理丰富的图形和交互提供了直接的解决方案。它提供了一个Adobe Animate开发人员熟悉的API，但包含了JavaScript的敏感性。它由一个完整的分层显示列表、一个核心交互模型和助手类组成，使使用Canvas更加容易。

### [echarts](https://echarts.apache.org/zh/index.html)

1. 一个基于 JavaScript 的开源可视化图表库。
2. 企业级图表库，百度开发。
3. [Vue 版 Echart](https://github.com/ecomfe/vue-echarts) https://github.com/ecomfe/vue-echarts

### [editor_md](http://editor.md.ipandao.com/)

### [Ejs](http://www.embeddedjs.com/)

模板引擎。

### Electron(https://www.electronjs.org/docs/latest)

[GitHub地址：](https://github.com/electron/electron)https://github.com/electron/electron

### [element ui](https://element-plus.gitee.io/zh-CN/)

Element UI 是一套采用 Vue 2.0 作为基础框架实现的组件库，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的组件库，提供了配套设计资源，帮助网站快速成型。

1. Element，一套为开发者、设计师和产品经理准备的基于[Vue 2.0](https://element.eleme.cn/#/zh-CN)的桌面端组件库。
2. [Element Plus](https://element-plus.gitee.io/zh-CN/) 基于Vue3面向设计师和开发者的组件库。

### [elevator.js]()

[GitHub地址：](https://github.com/tholman/elevator.js) https://github.com/tholman/elevator.js  
用做电梯的方式，伴着背景乐，返回到页面顶部。 Just for fun。

### [emscripten]()

一款基于LLVM, 可以将C/C++转换成Javascript的工具，使得Javascript可以近乎Native的速度。

### [Eruda]()

[GitHub地址：](https://github.com/liriliri/eruda/blob/master/doc/README_CN.md) https://github.com/liriliri/eruda

Eruda 是一个专为手机网页前端设计的调试面板，类似 DevTools 的迷你版，其主要功能包括：捕获 console 日志、检查元素状态、捕获XHR请求、显示本地存储和 Cookie 信息等等。

### [EventEmitter]()

浏览器版的 EventEmitter。

### [eventproxy]()

[GitHub地址：](https://github.com/JacksonTian/eventproxy) https://github.com/JacksonTian/eventproxy  
发布订阅，朴灵出品。

### [evil-icons]()

一个矢量图库，提供Ruby/Node等支持。

### [excellentexport]()

[GitHub地址：](https://github.com/jmaister/excellentexport) https://github.com/jmaister/excellentexport

* 把表格的内容生成excel。兼容 Firefox, Chrome, IE6+。

### [Exif.js]()

[GitHub地址：](https://github.com/exif-js/exif-js) https://github.com/exif-js/exif-js  
读取 JPEG 图片的拍摄信息。可以通过拍摄信息中的 Orientation 来解决 ios 手机上传竖拍照片会逆时针旋转90度的问题。

### [Fabric.js](http://fabricjs.com/)

[Fabric中文文档](http://funcion_woqu.gitee.io/fabric-doc/api/#basebrush)  
[Fabric中文文档导航](https://github.com/eternitywith/fabric.js-docs-cn/wiki)  
[Fabric下载地址](https://sourceforge.net/projects/fabric-js.mirror/files/latest/download)

* 是一个可以简化Canvas程序编写的库。为Canvas提供所缺少的对象模型, svg parser, 交互和一整套其他不可或缺的工具。
* 主要用对象的方式去编写代码。
* 在Canvas上创建、填充图形（包括图片、文字、规则图形和复杂路径组成图形）。
* 给图形填充渐变颜色。
* 组合图形（包括组合图形、图形文字、图片等）。
* 设置图形动画集用户交互。
* 生成JSON, SVG数据等。
* 生成Canvas对象自带拖拉拽功能。

### [fancyBox](http://fancyapps.com/fancybox/)

1. 一个用于放大缩小图片、Web 内容或者多媒体元素的库，优雅大方。
2. 浏览图片，弹出查看图片，视屏等等。

### [favico.js](http://lab.ejci.net/favico.js/)

1. 动态改favicon。
2. 可以放视频。

### [FileAPI]()

[GitHub地址：](https://github.com/mailru/FileAPI) https://github.com/mailru/FileAPI    
对文件选择框内的文件的一些处理。前端用户处理文件（拖放、多文件上传等）。

### [Fine Uploader]()

导入拖拽上传档案，跨浏览器、原生JavaScript又加上免费开源，只要载入JavaScript就可以开始运行，不依赖其他程序。

### [firefox.html]()

Firefox 在浏览器端的实现 —— HTML 版的 Firefox。

### [flatui]()

Flat-UI: Bootstrap的一款主题，简洁美观。

### [flexible.js]()

1. 阿里团队开源的一个库。使用flexible.js轻松搞定各种不同的移动端设备兼容自适应问题。
2. flexible.js实现了rem自适应，有了flexible.js，就不必再为移动端各种设备兼容烦恼。
3. flexible.js是如何通过rem实现自适应的呢？通过rem与px的换算，可以把设计稿从px转到rem。再也不用为各种设备横行而担忧。rem是相对于根元素<html>，这样就意味着，只需要在根元素确定一个px字号，则可以来算出元素的宽高。1rem=16px(浏览器html的像素，可以设定这个基准值），假如浏览器的html设为64px，则下面的元素则1rem=64px来运算。

### [flip](http://nnattawat.github.io/flip/)

兼容性可以。写的比较简单：

1. 只支持x方向翻转。
2. 类名都是规定好的。
3. 只能被调用一次。 改进版见[这里](https://github.com/iamjoel/be-grace-front-end-developer/tree/master/my-lib/flip/quickflip.js)

### [flippant.js]()

一款能够漂亮的网页元素翻转效果库。

### [flow]()

一个用来检测 Javascript 语法错误的库， Facebook 出品。

### [Fluidbox]()

页面上内嵌图片的放大缩小效果，类似于 Medium 中的效果。

### [focusable]()

是页面上一个元素高亮的库。

### [foundation]()

另一款前端模版框架，类似于 Bootstrap。

### [foundation-datepicker](http://foundation-datepicker.peterbeno.com/example.html)

* 时间选取组件。

### [Framework7]()

前端框架，是开发人员可以基于web技术构建IOS7程序。

### [full calendar](http://fullcalendar.io/)

* 支持脱放的方式来改变待办事宜的时间。

### [fullPage](http://alvarotrigo.com/fullPage/)

[GitHub地址：](https://github.com/alvarotrigo/fullPage.js) https://github.com/alvarotrigo/fullPage.js  
全屏显示。用滚轮来翻页。 [2.9.7](https://github.com/alvarotrigo/fullPage.js/releases/tag/2.9.7) 以后的版本是收费的。

### [functional.js]()

[GitHub地址：](https://github.com/leecrossley/functional-js/) https://github.com/leecrossley/functional-js/  
提够了一些Curry的支持。

### [fundebug](https://fundebug.com/)

* 提供监控报错的服务。全栈JavaScript错误监控。

### [G2](https://g2.antv.antgroup.com/)

是一套基于可视化编码的图形语法，以数据驱动，具有高度的易用性和扩展性，用户无需关注各种繁琐的实现细节，一条语句即可构建出各种各样的可交互的统计图表。

### [gentelella]()

* [GitHub地址：](https://github.com/puikinsh/gentelella) https://github.com/puikinsh/gentelella
* 免费皮肤

### [gif.js](https://jnordberg.github.io/gif.js/)

* [GitHub地址：](https://github.com/jnordberg/gif.js) https://github.com/jnordberg/gif.js
* 是一个可直接在浏览器上运行的 JavaScript GIF 编码器。
* 生成gif文件。

### [github-cards]()

用于生成 Github 信息卡片的库。

### [greensock]()

### [Hammer.js](http://hammerjs.github.io/)

* 是一个开源的，轻量级的javascript库，它可以在不需要依赖其他东西的情况下识别触摸，鼠标事件。
* 手势库。封装了Swipe, Tap, Pinch, Pan等手势。

### [handlebarsjs](https://handlebarsjs.com/)

* 基于Mustache的模板引擎。

下载地址：https://s3.amazonaws.com/builds.handlebarsjs.com/handlebars.min-v4.7.7.js
或安装  
npm install handlebars

### [handsontable](https://handsontable.com/)

* 表格组件，生成Excel外观的数据。

### [highcharts](http://www.highcharts.com/)

* 功能强大。是收费的。

### [holderjs](http://imsky.github.io/holder/)

* 生成占位图片。

### [hotcss]()

[GitHub地址](https://github.com/imochen/hotcss.git)：https://github.com/imochen/hotcss.git  
官网地址：http://imochen.github.io/hotcss/

移动端布局终极解决方案 --- 让移动端布局开发更加容易

不仅便捷了你的布局，同时它使用起来异常简单。可能你会说 talk is cheap,show me the code，那我现在列下hotcss整个项目的目录结构。

#### **介绍**

* hotcss不是一个库，也不是一个框架。它是一个移动端布局开发解决方案。使用hotcss可以让移动端布局开发更容易。
* 使用动态的HTML根字体大小和动态的viewport scale。
* 遵循视觉一致性原则。在不同大小的屏幕和不同的设备像素密度下，让页面看起来是一样的。

#### **优势**

* 保证不同设备下的统一视觉体验。
* 不需要你再手动设置viewport，根据当前环境计算出最适合的viewport。
* 支持任意尺寸的设计图，不局限于特定尺寸的设计图。
* 支持单一项目，多种设计图尺寸，专为解决大型，长周期项目。
* 提供px2rem转换方法，CSS布局，零成本转换，原始值不丢失。
* 有效解决移动端真实1像素问题。

### [hotkeys](http://jslite.io/hotkeys/)

* 键盘事件的封装。

### [hover_css]()

* 多项针对链接、按钮、Logo、SVG和图片的移入CSS3特效。

### [html2canvas](http://html2canvas.hertzen.com/)

html转化成canvas，可以用来做截图。

### [html5media](https://html5media.info/)

* HTML5播放器，简单的h5player，轻量级。

### [hybicon.js](http://hybicon.softwaretailoring.net/documentation.html)

SVG做的图标，带交互效果。如 hover, click。

### [hyhyhy]()

用于创建 基于 HTML5 的 演示文稿。

### [iCheck]()

一款漂亮的 Checkbox 插件。

### [iconate]()

[GitHub地址：](https://github.com/bitshadow/iconate) https://github.com/bitshadow/iconate
图片切换动画。

### [iconic](https://useiconic.com/icons/)

SVG做的图标。

### [iconpark]()

* [GitHub地址：](https://github.com/lvwzhen/iconpark) https://github.com/lvwzhen/iconpark
* Icon Font汇总。

### [id-card-uitls](libs/id-card-uitls.js)

身份证验证

### [IdCard]()

* [GitHub地址：](https://github.com/NoBey/IdCard) https://github.com/NoBey/IdCard
* 身份证的工具库，支持身份证号验证，获取地址，生日，男女等信息。

### [imagesLoaded](http://desandro.github.io/imagesloaded/)

选取的图片都加载好后执行调回。

### [Impress.js](https://developer.cdn.mozilla.net/media/uploads/demos/b/a/bartaz/54e3827142e4149a5c01db64c9517c84/impressjs_1333223745_demo_package/index.html#/bored)

各种旋转，和奇特的体验。

### [infinite-scroll]()

是jQuery一个用来实现无限滚动的插件。滚动加载，滚动到最下到自动加载。

### [Ink](http://zurb.com/ink/)

响应式html邮件框架。

### [interact.js]()

一个适用于现代浏览器的，用于处理 手势、拖放、缩放等的库。

### [Intro.js](http://usablica.github.io/intro.js/)

用来介绍网站的功能很不错。也可以做新手/用户引导。

### [iScroll.js](http://iscrolljs.com)

[GitHub地址：](https://github.com/cubiq/iscroll) https://github.com/cubiq/iscroll

[IScroll5中文文档](https://iiunknown.gitbooks.io/iscroll-5-api-cn/content/)

1. iScroll是一个高性能，资源占用少，无依赖，多平台的javascript滚动插件。它可以在桌面，移动设备和智能电视平台上工作。它一直在大力优化性能和文件大小以便在新旧设备上提供最顺畅的体验。
2. 功能强大，支持各种事件，不依赖任何的库，且插件丰富。

支持特性：

* （1）缩放（Pinch/Zoom）。
* （2）拉动刷新（Pull up/down to refresh）。
* （3）速度和性能提升。
* （4）精确捕捉元素。
* （5）自定义滚动条，在移动设备上用不错。

### [iSlider]()

[GitHub地址：](https://github.com/BE-FE/iSlider) https://github.com/BE-FE/iSlider  
无任何插件依赖的手机平台javascript滑动组件。

### [isotope]()

可以用来过滤、排列布局，实现美观的动态布局切换效果。

### [Jade](http://jade-lang.com/)

模板引擎。

### [javascript-algorithms]()

Javascript 实现的各种算法集合。

### [jcanvas](https://projects.calebevans.me/jcanvas)

基于 jQuery 的 canvas 工具库，支持托拽。[画画的Demo](https://projects.calebevans.me/painter/)

### [jcarousel](http://sorgalla.com/jcarousel/)

普通的幻灯，不兼容IE6。

### [jFeed]()

* [GitHub地址：](https://github.com/jfhovinne/jFeed) https://github.com/jfhovinne/jFeed
* 抓取，解析RSS内容（不能跨域，所以后台要做代理，所谓的解析Rss其实就是解析xml）。

### [JiaThis](http://www.jiathis.com/)

* 生成分享代码。分享到SNS。

### [jplayer](http://jplayer.org/)

* HTML5播放器，功能强大，可换肤。

### [jQTouch]()

用于辅助创建手机端的Web应用，支持主题、Zepto.js等。

### [jQuery-Animate-Enhanced]()

jQuery 动画库的一个增强，用于现代浏览器。

### [jquery-file-upload]()

[GitHub地址：](https://github.com/blueimp/jQuery-File-Upload) https://github.com/blueimp/jQuery-File-Upload  
上传文件组件。

### [jQuery-menu-aim]()

[GitHub地址：](https://github.com/kamens/jQuery-menu-aim) https://github.com/kamens/jQuery-menu-aim  
二级菜单的切换如Amazon主页上一样迅速。

### [jquery-mobile](http://jquerymobile.com/)

jQuery 团队开发的用于辅助手机端web app开发的库，基于HTML5。  
是一个基于html5的用户界面系统，旨在使所有智能手机、平板电脑和桌面设备合集都能访问到响应性的网站和应用程序。

### [jquery-mockjax]() mock

[GitHub地址：](https://github.com/jakerella/jquery-mockjax) https://github.com/jakerella/jquery-mockjax

### [jQuery-One-Page-Nav]()

单页应用中一个用于处理导航栏的库。

### [jquery-qrcode]()

[GitHub地址：](https://github.com/jeromeetienne/jquery-qrcode) https://github.com/jeromeetienne/jquery-qrcode      
生成二维码图片的jQuery 插件，很好用。该插件是基于 QR Code Generator 开发的。

### [jquery-ui]()

jQuery 团队开发的 UI 相关的前端库，功能强大。

### [jquery-validation]()

[GitHub地址：](https://github.com/jzaefferer/jquery-validation) https://github.com/jzaefferer/jquery-validation  
jQuery 的一个插件，用于校验 Form 表单。

### [jQuery-Validation-Engine](http://posabsolute.github.io/jQuery-Validation-Engine/)

表单验证。

### [Jquery.barrager.js]()

专业的网页弹幕插件。

### [jQuery.countdown]()

jQuery 倒计时插件。

### [jquery.hotkeys]()

jQuery插件，用于绑定热键。

### [jQuery.Marquee]()

[GitHub地址：](https://github.com/aamirafridi/jQuery.Marquee) https://github.com/aamirafridi/jQuery.Marquee  
跑马灯效果。

### [jquery.scrollTo（平滑滚动）]()

[GitHub地址：](https://github.com/flesler/jquery.scrollTo) https://github.com/flesler/jquery.scrollTo    
在页面上以一个元素为起始以动画的方式移动(ScrollTo)到另一个元素， 支持回退等。  
能够使得定位的时候更有体验感。

### [jquery.serializeJSON]()

jQuery 插件，用于将 form 表单序列化成JSON数据。

### [jquery.smartbanner]()

smartbanner 是从 IOS6 开始支持的一个新特性, 这个插件提供了对早期 IOS4/5 和 Android 的支持。

### [jQuery Cards](http://jquerycards.com/)

* 高质量的 jQuery 插件网站

### [jQuery easing]()

是GSGD的插件，可提供高级的宽松选项。 当从一个幻灯片过渡到另一个幻灯片时，我们将使用它来添加良好的缓动运动。

### [jQuery Grid](http://gijgo.com/grid)

* 表格组件，by gijgo.com。

### [jQuery ui datepicker](http://jqueryui.com/datepicker/)

* 时间选取组件，经典，不是很好看。

### [jqueryrotate](http://beneposto.pl/jqueryrotate/)

* 抽奖，旋转插件。可以用来做转盘抽奖效果。

### [jRss]()

* [GitHub地址：](https://github.com/malderete/jRss) https://github.com/malderete/jRss
* 简单版的jFeed。

### [js-sequence-diagrams]()

另一款可以根据文本生成流程图的库，类似于 Markdown 的语法。

### [js-xlsx]()

* [GitHub地址：](https://github.com/SheetJS/js-xlsx) https://github.com/SheetJS/js-xlsx
* Excel库。

### [js.js]()

Javascript 实现的 javascript JIT。

### [jScrollPane]()

自定义的滚动条，让所有浏览器都显示一样的滚动条。

### [JSDoc](http://usejsdoc.org/)

根据javascript文件中注释的信息，生成API文档。

### [jsGrid](http://js-grid.com/)

* 表格组件，Data Grid。

### [jsonp]()

* [GitHub地址：](https://github.com/webmodules/jsonp) https://github.com/webmodules/jsonp
* 与服务器端交互。

### [jsPDF]()

* [GitHub地址：](https://github.com/MrRio/jsPDF) https://github.com/MrRio/jsPDF
* 在浏览器端生成 pdf。

### [JSpreadsheets](http://jspreadsheets.com/)

* 表格组件，表格数据的组件库。

### [jster](http://jster.net/)

### [jwplayer](https://www.jwplayer.com/)

* HTML5播放器，被大量网站使用。

### [kendo]()

### [knockout]()

前端 MVVM 框架，用于开发富前端应用。

### [lax.js]()

* [GitHub地址：](https://github.com/alexfoxy/lax.js) https://github.com/alexfoxy/lax.js
* 视觉差插件。

### [layer]()

* [GitHub地址：](https://github.com/sentsin/layer) https://github.com/sentsin/layer
* 弹出框。兼容ie6+。

### [lazy.js]()

类似于 underscore, 但是会延迟执行，某些场景下，性能会有很大的提升。

### [LazyLoad]()

官网：Lazy Load 延伸：Vanilla JavaScript Lazy Load Plugin  
Lazy Load帮助高度较长的网页进行延迟载入图片，尚未浏览到该部分时，不会载入视角外的图片，提高效率。

### [lazysizes]()

功能强大的图片延迟加载工具，可以首先加载一个低质量的图片，然后再加载高质量的图片。

### [Leaflet](https://leafletjs.com/index.html)

* 开源的对移动端友好的地图工具库。

### [lerna]()

* [GitHub地址：](https://github.com/lerna/lerna) https://github.com/lerna/lerna
* 对一个项目中包含若干个 npm 包的管理。对这几个npm包内部依赖版本的管理和npm包的发布比较方便。

### [less.js](https://github.com/less/less.js)

* [GitHub地址：](https://github.com/less/less.js) https://github.com/less/less.js

### [Libraries.io](https://libraries.io/)

* 各种语言的库。

### [lightSlider]()

官网：JQuery lightSlider Github：sachinchoolur/lightslider  
JQuery lightSlider是一个轻量且响应式的跑马灯/幻灯片，附有缩图导览。另外还有相本功能、垂直跑马灯，应用层面广泛。

### [Lining.js]()

[GitHub地址：](https://github.com/zmmbreeze/lining.js) https://github.com/zmmbreeze/lining.js  
选择器增强，让浏览器实现类似`::nth-line(), ::nth-last-line()`的效果

### [little-loader]()

[GitHub地址：](https://github.com/walmartlabs/little-loader) https://github.com/walmartlabs/little-loader  
JS 加载器。Webpack 不支持加载外部js，可用这个。

### [lo-dash](https://lodash.com/)

与underscore.js的api基本一致。与underscore比其优势是，效率高；可自定义构建。

### [Loaders.css](https://connoratherton.com/loaders)

加载(Loding)效果，CSS做的。

### [loading]()

几种Loading效果，基于SVG。

### [localForage]()

Mozilla 出品，用于离线存储，基于IndexedDB, WebSQL 或者 localStorage, 提供一致的接口。

### [log]()

* [GitHub地址：](https://github.com/adamschwartz/log) https://github.com/adamschwartz/log
* 调试让控制台输出的log有样式。

### [logrocket](https://logrocket.com/)

* 前端录屏插件。

### [lunr.js]()

### [magicbox_tencent]()

* [腾讯magicbox可视化开发](https://magicbox.bk.tencent.com/static_api/v3/index.html#build/show)
* [腾讯magicbox前端开发组件库](https://magicbox.bk.tencent.com/static_api/v3/index.html#index?isPro=1)

### [Magnific-Popup]()

* [GitHub地址：](https://github.com/dimsemenov/Magnific-Popup) https://github.com/dimsemenov/Magnific-Popup
* 弹出框。兼容PC，Mobile。

### [markdown-it]()

新型 Markdown 解析器，快速，支持插件。

### [Masonry.js]()

* [GitHub地址：](https://github.com/desandro/masonry) https://github.com/desandro/masonry
* Masonry常用于瀑布流布局的插件。
* 图片的瀑布流展示，依赖jQuery。

### [matter-js]()

2D 物理效果引擎，碰撞、弹跳等。

### [MD5]()

[GitHub地址：](https://github.com/pvorb/node-md5) https://github.com/pvorb/node-md5  
用MD5的方式加密文件的库。
MD5（Message-Digest Algorithm）是计算机安全领域广泛使用的散列函数（又称哈希算法、摘要算法），主要用来确保消息的完整和一致性。常见的应用场景有密码保护、下载文件校验等。

### [mermaid]()

可以根据文本生成流程图，类似于 Markdown 的语法。

### [metrics-graphics]()

基于 D3 的图表库，简洁、高效，Mozilla 出品。

### [midnight.js]()

[GitHub地址：](https://github.com/Aerolab/midnight.js) https://github.com/Aerolab/midnight.js  
文字颜色随着背景变。

### [mithril.js]()

轻量型前端 MVC 框架，部分使用场景下性能优于 Angular.js 和 React。

### [mixitup](https://mixitup.kunkalabs.com/)

用漂亮的动画效果来完成排序和筛选

### [mobile-angular-ui]()

基于angularjs和bootstrap的web app开发框架。

### [Mock.js]()

[GitHub地址：](https://github.com/nuysoft/Mock) https://github.com/nuysoft/Mock  
[mock](http://baike.baidu.com/view/2445748.htm)
生成随机数据、Mock测试和Ajax 请求。

### [Modernizr]()

一个用来检测 HTML5 和 CSS3 支持情况的库

### [moment.js]()

轻量级专门解析、验证、操作、格式化日期的JavaScript函数库，Moment.js是为浏览器和Node.js而设计，所有组件都可以在这两个环境下运行。

### [money.js]()

轻量级货币转换库，web 和 node 皆可用。

### [move.js]()

基于 CSS3 的前端动画框架。

### [multiline]()

用于 Javascript 中的多行文本，类似于 Ruby 的 HERE Doc。

### [mustache](https://mustache.github.io/mustache.5.html)

[Github地址：](https://github.com/janl/mustache.js/) https://github.com/janl/mustache.js/  
下载地址：https://codeload.github.com/janl/mustache.js/zip/refs/tags/v4.2.0  
GitHub示例：https://github.com/mustache/mustache.github.com

1. 前端模板渲染引擎。
2. 如果希望像传统模板引擎一样可以有函数和参数处理等等的功能，那么Mustache就不是好的选择。

### [Nano ID](https://github.com/ai/nanoid/)

[Github地址：](https://github.com/ai/nanoid/) https://github.com/ai/nanoid/  
生成 uuid。

### [Node XLSX]()

支持解析和生成 xlsx 的问题。

[Github地址：](https://github.com/mgcrea/node-xlsx) https://github.com/mgcrea/node-xlsx

### [nodePPT](https://nodeppt.js.org/#slide=1)

国人做的，做ppt也相当不错。有些方面比reveal做的还好。但生成导出的html有些问题

[Github地址：](https://github.com/ksky521/nodePPT) https://github.com/ksky521/nodePPT  
安装  
npm install -g nodeppt

### [notie.js](https://jaredreich.com/notie/)

[GitHub地址：](https://github.com/jaredreich/notie) https://github.com/jaredreich/notie

* 通知组件，没有外部依赖。
* 字体大小会根据屏幕大小自动调整。

### [nouislider](https://refreshless.com/nouislider/) 用滚动条来设置/控制（音量等）。表单元素美化。

### [octocard]()

用于生成 Github 信息卡片的库。

### [onepage-scroll]()

提供类似于iPhone6展示页类似的效果，适用于单页应用，兼容到IE8。

### [OniUI](http://ued.qunar.com/oniui/index.html#avalon.accordion.doc.html)

* 去哪儿网做的一套基于Avalon的框架。

### [pagemap](https://larsjung.de/pagemap/)

给长页面加网页的缩略图。

### [pagePiling](http://alvarotrigo.com/pagePiling/)

和fullPage类似。

### [pagination.js]()

分页

### [panorama_viewer](https://github.com/peachananr/panorama_viewer)

轻量级全景图。代码不足两百行，基于jQuery。

### [parallax.js]()

一个用于响应智能手机 orientation 的库。

### [parallel.js]()

前后端通用的一个并行库。

### [parameter](https://github.com/node-modules/parameter)

验证参数的格式。

### [pdfkit](http://pdfkit.org/)

生成pdf。

### [perfect scrollbar](https://github.com/noraesae/perfect-scrollbar)

轻量级的滚动条。外观与mac上chrome的滚动条一样。 对IE11-兼容性不好。

### [PhotoSwipe]()

JS 的一个图片展示库。

### [pickadate.js](http://amsul.ca/pickadate.js/)

* 日期/时间选择器。
* 时间选取组件，轻量级，手机友好的，漂亮。但貌似只能在弹出层中显示，而没有下拉这种方式显示。

### [pigshell]()

一个由 Javascript 实现的Shell, 将互联网当做一个大的文件系统, 通过 cd/ls/cat…..等命令, 可以访问 Facebook/Twitter/Google Drive等网络服务。

### [please.js]()

* [GitHub地址：](https://github.com/wingify/please.js) https://github.com/wingify/please.js
* please.js是一个围绕PostMessage API的基于请求/响应的包装器，它利用了jQuery Promises。
* please.js是基于jQuery和jQuery Promise API之上的。为了使不同域名上的两个窗口之间的通信正常，它们都必须注入相同版本的jQuery和please.js。

### [plyr]()

轻量, 小巧, 美观的 HTML5 视频播放器。

### [prefixfree]()

* [GitHub地址：](https://github.com/LeaVerou/prefixfree/) https://github.com/LeaVerou/prefixfree/
* CSS 兼容性，根据 caniuse.com 数据库自动补全 CSS 私有前缀。

### [preloadjs](https://createjs.com/preloadjs)

* [GitHub地址：](https://github.com/CreateJS/PreloadJS) https://github.com/CreateJS/PreloadJS
* [下载地址：](https://codeload.github.com/CreateJS/PreloadJS/zip/refs/tags/1.0.0) https://createjs.com/downloads
* [压缩库文件下载地址：](https://code.createjs.com/) https://code.createjs.com/  
  一个JavaScript库，允许您管理和协调资产和数据的加载。  
  PreloadJS可以轻松地预加载您的资产：图像、声音、JS、字体、文本等。它使用XHR2在可用时提供真实的进度信息，或者在不可用时返回到标签加载和简化进度。它允许多个队列、多个连接、暂停队列等等。

### [Prism](https://prismjs.com/)

代码高亮对于开发者的博客来说，是非常必要的，这款插件具有强大的代码高亮支持功能。

### [prisma]()

* [GitHub地址：](https://github.com/prismagraphql/prisma/) https://github.com/prismagraphql/prisma/
* Prisma turns your database into a realtime GraphQL API。

### [progressbar.js]()

简洁美观的进度条，扁平化。

### [proTip](http://protip.rocks/)

提示。对比Bootstrap的tip。

### [q](https://github.com/kriskowal/q/)

Promise风格的 异步流程控制。

### [qrcode-generator]()

[GitHub地址：](https://github.com/kazuhikoarase/qrcode-generator/tree/master/js) https://github.com/kazuhikoarase/qrcode-generator/tree/master/js

QR Code Generator 各种语言的二维码生成工具。

### [qrcode.js（二维码生成）]()

[GitHub地址：](https://github.com/davidshimjs/qrcodejs) https://github.com/davidshimjs/qrcodejs    
QRCode.js 是一个用于生成二维码的 JavaScript 库。主要是通过获取 DOM 的标签,再通过 HTML5 Canvas 绘制而成,不依赖任何库。

### [quickflip](http://jonraasch.com/blog/quickflip-jquery-plugin)

下载地址：http://jonraasch.com/downloads/quickflip_0.1.zip  
卡片翻转效果。

### [Quill]()

[GitHub地址：](https://github.com/quilljs/quill) https://github.com/quilljs/quill

* 富文本编辑器，图片上传默认是把图片转成Base64来存，也支持监听上传事件，来将图片上传到服务器。
* Quill是当下高兼容性、强大、丰富且具有扩展性的文字编辑器。对于移动设备的支持度高。

### [range.css](http://danielstern.ca/range.css/)

滑块/Range。美化`input[type=range]`元素的外观。

### [rebound-js]()

实现部分物理效果，Facebook出品。

### [regexp-frequent](https://github.com/taijiweb/regexp-frequent)正则工具库。

### [regulex]()

用于生成 正则表达式 的可视化流程图。  
类似于Solr, 但是用于浏览器上的全文搜索引擎，可以为 JSON 创建索引，离线也可以使用。

### [Reveal.js](https://revealjs.com/)

* 下载地址： https://github.com/hakimel/reveal.js/archive/master.zip
* [GitHub地址：](https://github.com/hakimel/reveal.js) https://github.com/hakimel/reveal.js
* 3d滚动。做ppt相当不错

1. 是一个使用 HTML 语言制作演示文稿的 Web 框架 ，支持插入多种格式的内容，并以类似 PPT 的形式呈现。 类似的见nodePPT。
2. 支持 Markdown 语法，得以直接在 Markdown 编辑器里做 PPT。用 Markdown 语法所实现的精美、简洁的版式，在 Reveal.js 里仍能沿用。
3. 制作/发布灵活、不限平台，只需打开 HTML 文件。
4. 丰富的特性，支持过渡动画、代码高亮、视频背景、Markdown 语法、导出 PDF 等。
5. 极度轻量，占用空间和内存少。

### [rewrap]()

* [GitHub地址：](https://github.com/taijiweb/rewrap) https://github.com/taijiweb/rewrap
* 正则工具库。

### [rewrap-patch]()

* [GitHub地址：](https://github.com/taijiweb/rewrap-patch) https://github.com/taijiweb/rewrap-patch
* 正则工具库。

### [roundabout]()

* [GitHub地址：](https://github.com/fredleblanc/roundabout) https://github.com/fredleblanc/roundabout
* 3d切换。

### [rrweb-io](https://www.rrweb.io)

* [GItHub地址：](https://github.com/rrweb-io/rrweb/blob/master/guide.zh_CN.md) https://github.com/rrweb-io/rrweb
* 支持前端屏幕记录。

### [Scence.js](https://scene.js.org/)

* 做基于时间线的动画库。具体的若干时间点，给元素设置指定的样式。

### [screenfull.js]()

* 全屏插件，支持各大浏览器。

### [scriptcam](http://www.scriptcam.com/)

* 与摄像头交互。

### [scrolldeck]()

* [GItHub地址：](https://github.com/johnpolacek/scrolldeck.js) https://github.com/johnpolacek/scrolldeck.js
* 视觉差插件。

### [ScrollFix]()

* [GItHub地址：](https://github.com/joelambert/ScrollFix) https://github.com/joelambert/ScrollFix
* 对 IOS 的滚动优化：局部滚动。配合使用： `overflow-y: scroll; /* has to be scroll, not auto */-webkit-overflow-scrolling: touch`。

### [ScrollMagic]()

https://github.com/janpaepke/ScrollMagic

* 神奇的滚动交互效果插件，可以在滚动的过程中设置各种各样的动态效果。
* 视觉差插件，对 superscrollorama 的重写。

### [scrollMonitor]()

前端插件用来监控元素的滚动事件(进入、退出等)，性能很好。

### [scrollorama]()

* [GitHub地址：](https://github.com/johnpolacek/scrollorama) https://github.com/johnpolacek/scrollorama
* 视觉差插件，比较简单。

### [scrollReveal.js]()

动态显示内容，使元素以非常酷帅的方式进入画布 (Viewpoint)。

### [ScrollToFixed]()

ScrollToFixed能够让网页的导航或表头等固定在顶部或底部，用户更方便的操作或查看信息。除了导航和表头，也可以固定其他内容，比如广告、返回顶部等。

### [seajs]()

前端模块加载器，解决模块化、依赖等问题。

### [select2](http://ivaynberg.github.io/select2/index.html)

多选下拉框。表单元素美化。

### [select2/jquery.searchableSelect.js]()

说明:简单而好用的下拉框加搜索插件

### [selectivity](http://arendjr.github.io/selectivity/)

和unfirom比较类似。表单元素美化。

### [sensor.js]()

在智能移动设备浏览器上，通过HTML5的api使用移动设备的功能。定位、运动、倾斜等。

### [simple-hint]()

* [GitHub地址：](https://github.com/catc/simple-hint) https://github.com/catc/simple-hint
* 提示信息。用css做的。兼容性IE 9+。

### [Simple Events Calendar](http://preview.codecanyon.net/item/simple-events-calendar-js/full_screen_preview/462149?ref=themespotters)

时间选取组件。收费。

### [skrollr](http://prinzhorn.github.io/skrollr/)

* [GitHub地址：](https://github.com/Prinzhorn/skrollr) https://github.com/Prinzhorn/skrollr
* 是一款轻量级且强大的js库，实现异步滚动的开源库。

### [slick]()

功能异常强大的一个图片滑动切换效果库。

### [slideout]()

一个非常美观的侧滑菜单。

### [slidesjs](http://slidesjs.com/)

* [Slides](https://nathansearles.github.io/slidesjs/) – 是一个简单的，容易定制和风格化，的jQuery幻灯片插件。
* Slides提供褪色或幻灯片过渡效果，图像淡入淡出，图像预压，自动生成分页，循环，自动播放的自定义等很多选项。

### [slip]()

一个通过滑动或者拖拽来操控列表的库。

### [SmartPhoto]()

https://github.com/appleple/SmartPhoto  
专为移动设备打造的响应式图像查看器，它易于使用，并支持手势触摸操作，例如捏合或者滑动。同时，它还具备对初学者友好的大量实用的事件处理器，以及用户自定义选项。

### [snabbt.js]()

一个利用Javascript和CSS transform的animation库。

### [Snap.js]()

https://github.com/jakiestfu/Snap.js
左/右侧导航的出现效果。

### [Snap.svg](http://snapsvg.io/)

操作SVG的JS库。号称 SVG 的 jQuery。

### [SocialButtons]()

漂亮的社交按钮。

### [Sortable]()

现代浏览器上用于实现元素拖拽排序的功能，支持 Meteor, AngularJS, React，不依赖 jQuery。  
Sortable可以对HTML对象做拖拽移动清单的JavaScript函数库，支持移动设备且不依赖jQuery等其他第三方，并兼容Bootstrap等CSS框架。

### [soundjs](https://createjs.com/soundjs)

* [GitHub地址：](https://github.com/CreateJS/SoundJS) https://github.com/CreateJS/SoundJS
* [下载地址：](https://codeload.github.com/CreateJS/SoundJS/zip/refs/tags/1.0.0) https://createjs.com/downloads
* [压缩库文件下载地址：](https://code.createjs.com/) https://code.createjs.com/  
  一个JavaScript库，它提供了一个简单的API和强大的功能，可以轻松处理音频。轻松将音频文件加载绑定到PreloadJS。    
  SoundJS抽象了HTML5声音实现，使为游戏或丰富体验添加一致的跨浏览器声音变得更加容易。您可以查询功能，然后指定特定设备或浏览器使用的API、插件和功能并确定其优先级。

### [Spectrum](http://bgrins.github.io/spectrum/?color=&color2=%233355cc&color3=%23000000#toc0)

Js实现的颜色选择器 (Colorpicker)。

### [stellar.js](http://markdalgleish.com/projects/stellar.js/)

[GitHub地址：](https://github.com/markdalgleish/stellar.js) https://github.com/markdalgleish/stellar.js

* 视觉差插件，让图片或背景图以不同速率移动，已停止维护。
* 视差滚动效果，前端用于实现异步滚动效果的库，现已不再维护。可轻松创建视差滚动站点。

### [stickybits]()

[GitHub地址：](https://github.com/dollarshaveclub/stickybits) https://github.com/dollarshaveclub/stickybits  
CSS 兼容性，`position: sticky` polyfills。

### [store.js]()

[GitHub地址：](https://github.com/marcuswestin/store.js) https://github.com/marcuswestin/store.js  
对 localStorage 的封装。兼容 IE6+。

### [streamjs](https://github.com/winterbe/streamjs)

用流的方式来对数组，对象进行系列操作。

### [strman](https://github.com/dleitee/strman)

字符串操作库。它为各种实用程序、格式选项和字符串转换，提供了超过 60 种实用的方法。

### [Sugar](https://github.com/andrewplummer/Sugar/)

在原生对象上增加一些工具方法。

### [summernote]()

[GitHub地址：](https://github.com/summernote/summernote) https://github.com/summernote/summernote    
WYSIWYG 富文本编辑器。在移动设备上用不错。

### [superscrollorama]()

[GitHub地址：](https://github.com/johnpolacek/superscrollorama) https://github.com/johnpolacek/superscrollorama  
视觉差插件，能做的效果更多，但要用第三方Tween的库，使用起来比较复杂。

### [SuperSlide](http://www.superslide2.com/)

参见：TouchSlide  
国产库！兼容IE6，焦点图/幻灯片/Tab标签切换/图片滚动/无缝滚动等常见效果，支持移动端。

### [svgicons](http://svgicons.sparkk.fr/)

SVG做的图标。

### [sweetalert]()

一个非常美观的用于替换浏览器默认 alert 的库。

### [swfobj](https://code.google.com/archive/p/swfobject/wikis/documentation.wiki)

* flash 能够自动检测PC、Mac机器上各种主流浏览器对Flash插件的支持情况。它使得插入Flash媒体资源尽量简捷、安全。而且它是非常符合搜索引擎优化的原则的。此外，它能够避免您的HTML、XHTML中出现object、embed等非标准标签，从而符合更加标准。

### [swipebox]()

jQuery 插件，用于处理移动端的触摸事件。

### [swiper](https://swiper.com.cn/)

[GitHub地址：](https://github.com/nolimits4web/swiper/) https://github.com/nolimits4web/swiper/     
[Swiper中文网](http://www.swiper.com.cn/)

1. Swiper是纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端。能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。
2. PPT动态播放效果。幻灯片/跑马灯插件，使用效能高，并可运用在移动设备上及混合式App上，不但在最新版本的IOS上运行良好，在Android、Windows Phone 8和PC设备上一样表现优秀。要注意的是，Swiper并不兼容所有平台设备，而是专注于当下主流平台设备的兼容性和效能上。
3. 同时Swiper也是Framework7和Ionic Framework的组件的一部分。
4. 支持硬件加速。性能良好。

### [switchery](http://abpetkov.github.io/switchery/)

IOS 7上Switch开关组件的JS实现, 支持 IE8 及以上浏览器。表单元素美化。

### [Tabslet]()

一个用于页签的jQuery插件，轻量级且操作容易。

### [tagcanvas](http://www.goat1000.com/tagcanvas.php)

3D标签云效果。

### [template.js]()

template.js是一款JavaScript模板引擎，用来渲染页面。

### [textillate_js]()

由Twitter推出，灵活扎实的建议列表函数库。

### [TheaterJS]()

[GitHub地址：](https://github.com/Zhouzi/TheaterJS)  https://github.com/Zhouzi/TheaterJS    
一个用于模拟人输入状态的JS库。

### [three_js]()

易于使用且轻量级3D函数库，提供canvas、SVG、CSS3 3D和WebGL渲染器。

### [TimeCat]()

[GitHub地址：](https://github.com/oct16/TimeCat/blob/master/README.cn.md) https://github.com/oct16/TimeCat

* 一套网页录屏的解决方案，利用其独特的算法，提供超高性能，超高压缩比的网页无损录制。
* 可以广泛运作于监控系统，行为分析，案例复盘，远程教育，低流量视频协同等场景。

### [timelinejs]()

[GitHub地址：](https://github.com/ilkeryilmaz/timelinejs/) https://github.com/ilkeryilmaz/timelinejs/  
用时间轴方式展示信息。

### [timesheet.js]()

基于 HTML5 & CSS3 时间表。

### [TinyMCE](https://www.tinymce.com/tryit/full.php)

* 富文本编辑器，对html内容进行实时的编辑。
* TinyMCE是功能齐全且轻量级的HTML编辑器，但需要在IE11以上才可以运行。

### [toastr]()

toastr是一个提示信息JavaScript函数库，必须载入jQuery，宗旨是利用简单的程序函数库来做定制化跟扩展。toastr提供一个范例页面toastr examples，方便自订效果跟产生源码，类似Customize and download · Bootstrap的效果，方便使用者加快流程，先前介绍的ALERTIFY JS整体层面比toastr好很多，无论原生JavaScript以及整体文件大小和功能延展性，但toastr简单使用的操作模式，如果有旧项目是在jQuery的环境下，要做一些定制化功能，或许就是不错的选择。

### [Tocbot（目录生成）]()

[GitHub地址：](https://github.com/tscanlin/tocbot/releases) https://github.com/tscanlin/tocbot/releases    
根据文章的标题级别自动生成目录对一篇文章来说是一个比较实用的功能。

### [todomvc]()

分别基于 AngularJS/EmberJS/Backbone等实现的 TODO List, 帮助开发者选择前端 MVC 库

### [Toolbar_js]()

一个产生工具列的jQuery插件。

### [totoro]()

稳定的跨浏览器测试工具。

### [Touch.js](http://www.bootcdn.cn/touchjs/)

[Touch.js](https://allcky.github.io/touchjs/)是移动设备上的手势识别与事件库, 由百度云Clouda团队维护，也是在百度内部广泛使用的开发工具。

1. 手势库专为移动设备设计，请在Webkit内核浏览器中使用。
2. 原生出色的加速度感知与缓动效果，优秀的单指旋转手势。
3. 无侵入设计，与现有代码与框架共存。
4. 基于原生事件，支持事件代理, 性能更好。
5. 极简的API，秒速上手，玩转手势。

### [TouchSlide](http://www.superslide2.com/)

参考SuperSlide。

### [transformicons](http://www.transformicons.com/)

图标点击时，会有一些变换效果。如，加号变成叉号。

### [transformjs]()

[GitHub地址：](https://github.com/AlloyTeam/AlloyTouch/tree/master/transformjs) https://github.com/AlloyTeam/AlloyTouch/tree/master/transformjs  
Made css3 transform super easy。腾讯出品。

### [transit]()

[GitHub地址：](https://github.com/rstacruz/jquery.transit) https://github.com/rstacruz/jquery.transit  
对元素进行css的变换。

### [Treed](http://colorify.rocks/index.html)

树编辑器。

### [trix]()

Basecamp 公司出品的富文本编辑器，简洁小巧。

### [turn.js]()

[GitHub地址：](https://github.com/blasten/turn.js) https://github.com/blasten/turn.js  
做一本书，带漂亮的翻页的效果。

### [tweenjs](https://createjs.com/tweenjs)

* [GitHub地址：](https://github.com/CreateJS/TweenJS) https://github.com/CreateJS/TweenJS
* [下载地址：](https://codeload.github.com/CreateJS/TweenJS/zip/refs/tags/1.0.0) https://createjs.com/downloads
* [压缩库文件下载地址：](https://code.createjs.com/) https://code.createjs.com/  
  一个简单但强大的JavaScript库，用于推文和动画HTML5和JavaScript属性。独立工作或与EaselJS集成。
  TweenJS是一个用于JavaScript的简单tweening库。它是为了与EaselJS库很好地集成而开发的，但并不依赖于或特定于它。它支持数字对象属性和CSS样式属性的tweening。API简单但功能强大，可以通过链接命令轻松创建复杂的tween。

### [typeahead_js]()

由Twitter推出，灵活扎实的建议列表函数库。

### [ua-parser-js]()

[GitHub地址：](https://github.com/faisalman/ua-parser-js) https://github.com/faisalman/ua-parser-js

* 探测具体浏览器和版本，操作系统，设备类型等。

### [ueditor](http://ueditor.baidu.com/website/)

* [GitHub地址：](https://github.com/fex-team/ueditor.git) https://github.com/fex-team/ueditor.git
* [UEditor文档](http://fex-team.github.io/ueditor/)
* 富文本编辑器，百度做的。
* 轻量，可定制，注重用户体验。
* 开源基于MIT协议，允许自由使用和修改代码。

### [underscore.js](http://underscorejs.org/)

中文文档：https://www.underscorejs.cn/  
[GitHub地址：](https://github.com/jashkenas/underscore) https://github.com/jashkenas/underscore

1. 一个 JavaScript 实用库，提供了一整套函数式编程的实用功能，但是没有扩展任何 JavaScript 内置对象。
2. Underscore 提供了100多个函数,包括常用的: map, filter, invoke — 当然还有更多专业的辅助函数,如:函数绑定, JavaScript 模板功能,创建快速索引, 强类型相等测试, 等等.
3. Underscore 是 DocumentCloud 的一个开源组件。

### [uniform](http://uniformjs.com/)

提供对下拉框，单，复选框，按钮等表单元素的美化。

### [uri.js]()

[GitHub地址：](https://github.com/medialize/URI.js) https://github.com/medialize/URI.js  
uri操作。

### [vConsole]()

[GitHub地址：](https://github.com/WechatFE/vConsole) https://github.com/WechatFE/vConsole  
调试，轻量、可拓展、针对手机网页的前端开发者调试面板插件。

### [velocity]()

[GitHub地址：](https://github.com/julianshapiro/velocity) https://github.com/julianshapiro/velocity  
提高Jquery动画的性能。以及颜色动画之类的新特性。

### [vivus]()

可以动态描绘 SVG 的 JS 库, 支持多种动画。

### [walkway]()

[GitHub地址：](https://github.com/ConnorAtherton/walkway) https://github.com/ConnorAtherton/walkway  
以动画的方式，渐渐地画出 SVG 的路径。

### [Watch.js]()

[GitHub地址：](https://github.com/melanke/Watch.JS) https://github.com/melanke/Watch.JS  
监视对象或属性的变化。

### [Waypoints（滚动侦测）](http://imakewebthings.com/waypoints/)

[Github地址：](https://github.com/imakewebthings/waypoints) https://github.com/imakewebthings/waypoints

一个jQuery插件，每当您滚动到某个元素时，该插件都会执行一个函数。这使站点上的导航可以根据滚动条的位置突出显示我们正在播放的幻灯片。

1. 能够侦测滚动时，现在正显示的内容，可以根据需要改变组件的显示与隐藏。
2. 当滚动到某个元素时，Waypoints是触发函数的最简单方法。

下载 https://github.com/imakewebthings/waypoints/zipball/latest  
或安装  
npm install waypoints

### [web-animations-js]()

Javascript 实现的 Web Animation API。

### [wookmark](http://www.wookmark.com/jquery-plugin)

图片墙。

### [Wookmark-jQuery]()

jQuery 的一个插件，可以用来实现瀑布流的效果。

### [wowslider](http://wowslider.com/rq/jquery-image-viewer/)

幻灯切换时各种很炫的效果。收费。

### [wScratchPad]()

* [Github地址：](https://github.com/websanova/wScratchPad) https://github.com/websanova/wScratchPad
* 抽奖，刮刮卡刮奖效果。

### [wysihtml]()

富文本编辑器，适用于现代浏览器。

### [XHEditor]()

富文本编辑器。

### [xscroll]()

* [Github地址：](https://github.com/huxiaoqi567/xscroll) https://github.com/huxiaoqi567/xscroll
* 滚动条。

### [YOU MIGHT NOT NEED JQUERY PLUGINS](http://youmightnotneedjqueryplugins.com/)

* [Github地址：](https://github.com/HubSpot/YouMightNotNeedjQuery) https://github.com/HubSpot/YouMightNotNeedjQuery
* 不依赖jQuery的js插件。

### [yoxview](http://www.yoxigen.com/yoxview/)

浏览图片，弹出查看图片，图片尺寸缩放很自然。

### [zebra-datepicker](http://stefangabos.ro/jquery/zebra-datepicker/)

* 时间选取组件，可配置性很强。但貌似只能在弹出在右上方。

### [zepto.fullpage]()

* [Github地址：](https://github.com/yanhaijing/zepto.fullpage) https://github.com/yanhaijing/zepto.fullpage
* 专注于移动端的fullPage.js，依赖Zepto。

### [Zepto.js]()

用于现代浏览器的兼容jQuery的库。  
Zepto的设计目的是提供 jQuery 的类似的API，但并不是100%覆盖 jQuery。是一个轻量级的针对现代高级浏览器的JavaScript库，与JQuery有着类似的API。Zepto设计的目的是有一个5-10k的通用库、下载并快速执行、有一个熟悉通用的API，所以能把主要的精力放到应用开发上。

### [ZeroClipboard]()

[Github地址：](https://github.com/zeroclipboard/ZeroClipboard) https://github.com/zeroclipboard/ZeroClipboard  
将内容复制到剪切板兼容主流浏览器的解决方案。

### [zoomooz]()

jQuery 插件，用来处理浏览器缩放。

### [zTree -- jQuery 树插件](http://www.treejs.cn/v3/main.php)

https://treejs.cn/v3/main.php#_zTreeInfo
文件树形视图控件