JavaScript 的开源功能插件和框架小集锦

JavaScript 是一个在全球范围内都很是受欢迎的脚本语言，由 Netscape 的 LiveScript 发展而来，可用于 Web 开发、移动应用开发、服务器端开发等。它因简单、安全、动态和跨平台等特色而受到新老开发者的追捧。本文整理了一些基于 Javascript 的开源功能插件和框架，但愿能给你的开发带来帮助。

1、MV* 框架和库

一、Angular JS

Angular JS (Angular.JS) 是一组用来开发 Web 页面的框架、模板以及数据绑定和丰富 UI 组件。它支持整个开发进程，提供 web 应用的架构，无需进行手工 DOM 操做。 AngularJS 很小，只有 60K，兼容主流浏览器，与 jQuery 配合良好。

DEMO：https://www.angularjs.org/

二、React.js

React.js（React）是 Facebook 推出的一个用来构建用户界面的 JavaScript 库。已经应用于构建 Instagram 网站及 Facebook 部分网站。

DEMO：https://facebook.github.io/react/

三、Vue.js

Vue.js 是构建 Web 界面的 JavaScript 库，提供数据驱动的组件，还有简单灵活的 API，使得 MVVM 更简单。

DEMO：http://vuejs.org/

四、Ember.js

Ember 是一个雄心勃勃的 Web 应用程序，消除了样板，并提供了一个标准的应用程序架构的 JavaScript 框架。

DEMO：http://emberjs.com/

五、Backbone.js

Backbone.js 是一种重量级 javascript  MVC 应用框架，经过 Models 进行 key-value 绑定及 custom 事件处理，经过 Collections 提供一套丰富的 API 用于枚举功能，经过 Views 来进行事件处理及与现有的 Application 经过 RESTful JSON 接口进行交互。

DEMO：http://backbonejs.org/

六、Meteor

Meteor 是一组新的技术用于构建高质量的 Web 应用，提供不少现成的包，可直接在浏览器或者云平台中运行。

DEMO：https://www.meteor.com/

七、regularJS

看到 regular 的名字就能感觉到扑面而来的山寨味，但 regularjs 的出现毫不仅仅是做者造轮子情绪泛滥的结果。在 angular 大行其道的时期也激励产生了不少优秀框架，如 vue.js、avalon.js、reactive 等，而 regular 正是在这种百花齐放的时候产生，最终在实现上采起了angular的数据更新策略，提倡极致的声明式和裸数据操做, 依赖于基于字符串的模板描述结构结合更规范性的类式继承的组件体系来定义数据层的业务逻辑。

DEMO：http://regularjs.github.io/

八、T3.js

T3js（t3.js）与 MVC 框架不一样，T3 是创建在可伸缩 JavaScript 应用体系结构的概念之上来建立松耦合、少模型的系统，以此来建立大型 JavaScript 应用。

DEMO：http://t3js.org/

九、Knockout.js

Knockout 是个JavaScript library，帮助建立丰富的显示和编辑器 UI，经过干净的底层数据模型。你能够在任什么时候候动态更新 UI 的选择部分。

DEMO：http://knockoutjs.com/

十、Spine.js

Spine.js 是一个用于构建 JavaScript Web 应用的轻量级框架。Spine 可以让你使用 MVC 的框架思路来开发Web应用。

DEMO：http://spinejs.com/

2、UI 库

一、Bootstrap

Bootstrap 是快速开发 Web 应用程序的前端工具包。它是一个 CSS，HTML 和 JS 的集合，使用了最新的浏览器技术，给你的 Web 开发提供了时尚的版式，表单，buttons，表格，网格系统等等。

DEMO：http://getbootstrap.com/

二、Semantic UI

Semantic UI — 彻底语义化的前端界面开发框架，跟 Bootstrap 比起来，仍是有些不一样的，在功能特性上、布局设计上、用户体验上均存在不少差别。

DEMO：http://semantic-ui.com/

三、ZUI

ZUI 是禅道项目管理软件团队在完善本身产品过程当中造成的一个开源前端实践方案，它具备简单美观，易于使用，轻快独立稳定等特色，比较适合中文环境。

DEMO：http://zui.sexy/

四、Layui 

Layui 是一款带着浓烈情怀的国产前端UI框架，她追求极简，又不失丰盈的内在，说她是史上最轻量的结晶，彷佛并不为过。一切都源自于她对原生态的执着，对前端社区的那些噪杂声音的过滤，以及她自己的精心雕琢。

DEMO：http://www.layui.com/

５、Amaze UI

Amaze UI 是中国首个开源 HTML5 跨屏前端框架，旨在帮助开发者提升开发效率，提高网页效果，即用最短的时间作出最赞的网页，使更多的前端开发者再也不受前端复杂代码困扰。

DEMO：http://www.amazeui.org/

六、Flat UI

Flat UI 是一套精美的扁平风格 UI 工具包，基于 Twitter Bootstrap 实现。这套界面工具包含许多基本的和复杂的 UI 部件，例如按钮，输入框，组合按钮，复选框，单选按钮，标签，菜单，进度条和滑块，导航元素等等。

DEMO：https://designmodo.com/flat-free/

七、Masonry

Masonry 是一 个用来布局的 jQuery 插件，看了下面这张对比图你就知道它的用途：

DEMO：http://masonry.desandro.com/

八、qooxdoo

qooxdoo 是一个用于开发 Ajax 应用程序的 GUI 框架，使用它能够开发出相似于 Window 桌面风格的 Web 应用程序。

DEMO：http://qooxdoo.org/

3、编辑器

一、Editor.md

Editor.md 是一个可嵌入的开源 Markdown 在线编辑器组件，你能够很方便用在浏览器、NW.js（Node-webkit）等地方，基于CodeMirror、jQuery 和 Marked 构建。

DEMO：https://pandao.github.io/editor.md/

二、CodeMirror

CodeMirror 是一款“Online Source Editor”，基于Javascript，短小精悍，实时在线代码高亮显示，他不是某个富文本编辑器的附属产品，他是许多大名鼎鼎的在线代码编辑器的基础库。

DEMO：http://codemirror.net/

三、TinyMCE

TinyMCE 是一个轻量级的基于浏览器的所见即所得编辑器，支持目前流行的各类浏览器，由 JavaScript 写成。功能配置灵活简单（两行代码就能够将编辑器嵌入网页中），支持 AJAX。另外一特色是加载速度很是快，若是你的服务器采用的脚本语言是 PHP，那还能够进一步优化。

DEMO：https://www.tinymce.com/

四、Summernote 

Summernote 是一个简单灵活的所见即所得的 HTML 在线编辑器，基于 jQuery 和 Bootstrap 构建，支持快捷键操做，提供大量可定制的选项。

DEMO：http://summernote.org/

五、CKEditor

CKEditor 是新一代的 FCKeditor，是一个从新开发的版本。CKEditor 是全球最优秀的网页在线文字编辑器之一，因其惊人的性能与可扩展性而普遍的被运用于各大网站。

DEMO：http://ckeditor.com/

六、ContentTools

ContentTools 是一个用于构建 HTML 内容的 WYSIWYG 编辑器的 JS 库。

DEMO：http://getcontenttools.com

4、测试工具

一、Mocha

Mocha 是一个简单、灵活有趣的 JavaScript 测试框架，用于 Node.js 和浏览器上的 JavaScript 应用测试。Mocha 是具备丰富特性的 JavaScript 测试框架，能够运行在 Node.js 和浏览器中，使得异步测试更简单更有趣。Mocha 能够持续运行测试，支持灵活又准确的报告，当映射到未捕获异常时转到正确的测试示例。

DEMO：http://mochajs.org/

二、Karma

Karma 是一个简单的 javascript 测试工具，它容许在多个真正的浏览器执行 JavaScript 代码。

DEMO：http://karma-runner.github.io/

三、CasperJS

CasperJS 是一个开源的导航脚本和测试工具，使用 JavaScript 基于 PhantomJS 编写，用于测试 Web 应用功能，Phantom JS是一个服务器端的 JavaScript API 的 WebKit。其支持各类Web标准： DOM 处理, CSS 选择器, JSON, Canvas, 和 SVG。

DEMO：http://casperjs.org/

四、Jasmine

Jasmine 是一个简易的JS单元测试框架。Jasmine 不依赖于任何浏览器、DOM、或者是任何 JavaScript 而存在。它适用于全部网站、Node.js 项目，或者是任何可以在 JavaScript 上面运行的程序。 

DEMO：http://jasmine.github.io/

五、Selenium

Selenium (SeleniumHQ) 是 thoughtworks 公司的一个集成测试的强大工具，如今存在2个版本，一个叫  selenium-core, 一个叫 selenium-rc 。

DEMO：http://www.seleniumhq.org/

六、Chai

Chai 是一个针对 Node.js 和浏览器的行为驱动测试和测试驱动测试的诊断库，可与任何 JavaScript 测试框架集成。

DEMO：http://chaijs.com/

七、SlimerJS

SlimerJS 是一个提供给 Web 开发人员，可经过脚本编程控制的浏览器。它可让你使用 Javascript 脚本操纵一个网页：打开一个网页，点击连接，修改的内容等，这对于作功能测试，页面自动机，网络监控，屏幕捕获等是很是有用的。

DEMO：http://www.slimerjs.org/index.html

八、Phantom JS

Phantom JS 是一个服务器端的 JavaScript API 的 WebKit。其支持各类 Web 标准： DOM 处理, CSS 选择器, JSON, Canvas, 和 SVG。

DEMO：http://www.phantomjs.org/

5、CMS 

一、DoraCMS

DoraCMS 是基于 Nodejs+express+mongodb 编写的一套内容管理系统，其结构清晰、模块简单，上手很容易。

DEMO：http://www.html-js.cn/

二、Cody

Cody 结合了 Nodejs 和 CMS，是基于 JavaScript 的内容管理系统。做者有超过15年的CMS开发经验，在用户体验和性能上都作得很好，有很大的潜力。

DEMO：http://howest.cody-cms.org/en/

三、Apostrophe

Apostrophe 是一个基于 Node.js 开发的内容管理系统，核心模块提供了丰富的内容编辑功能，提供一个必须的服务用来跟你的 Express 应用绑定。

DEMO：http://apostrophenow.org/

四、Ghost

Ghost 是一个开源的博客平台, 能够把他看做 WordPress 的一个挑战者。Ghost 基于 JavasSript 的 Node.js 进行开发，在可预见的将来里，JS 无疑比 PHP 有着更多的优点。

DEMO：https://ghost.org/

五、KeystoneJS

KeystoneJS 是以 Express 和 MongoDB 为基础搭建的 Node.js CMS 和 Web 应用程序平台。

DEMO：http://keystonejs.com/zh/

6、表格/网格

一、DataTables

DataTables 是一个 jQuery 的表格插件。这是一个高度灵活的工具，依据的基础逐步加强，这将增长先进的互动控制，支持任何 HTML 表格。

DEMO：http://www.datatables.net/

二、jqGrid

jqGrid 是一个用来显示网格数据的jQuery插件，文档比较全面，附带中文版本。

DEMO：http://www.trirand.com/

三、jTable 

jTable 是一个 jQuery 插件用来建立基于 Ajax 的 CRUD 表格，无需进行 HTML 和 JavaScript 编码。

DEMO：http://www.jtable.org/

四、ParamQuery

ParamQuery 是一种轻量级的 jQuery 网格插件，基于用于用户界面控制、具备一致 API 的优秀设计模式 jQueryUI Widget factory 建立，可以在网页上展现各类相似于 Excel 和 Google Spreadsheet 效果的网格。

DEMO：http://paramquery.com/

转自https://my.oschina.net/u/2903254/home