转载自 http://www.cnblogs.com/xiaohuochai/p/7041595.html
作者 @小火柴的蓝色理想
原文有删改
DOM
常用方案
-
jQuery
jQuery
是曾经风靡一时的最流行的前端解决方案,jQuery特有的链式调用的方式简化了javascript的复杂操作,而且使人们不再需要关心兼容性,并提供了大量的实用方法 -
zepto.JS
zepto
是jQuery
的精简版,针对现代高级浏览器的JavaScript
工具库,针对移动端设计,去除了大量jQuery
的兼容代码,提供了简单的手势,部分API
的实现方式不同。 如果你会用jQuery
,那么你就已经会用Zepto
了。 -
mootools
mootools
源码清晰易懂,严格遵循Command-Query
(命令-查询)的接口规范,没有诸如jQuery
的两义性接口。还有一个不得不提的特点是,使用选择器获取的是DOM
原生对象,而不是被包装过的对象。而它支持的诸多方法则是通过直接扩展DOM
原生对象实现的,这也是它的争议所在
专业领域
-
手势 : Hammer.JS
包括了常见手势封装(Tab、Hold、Transform、Swifp
)并支持自定义扩展 -
局部滚动 : iscroll.JS
移动端position:fix + overflow:scroll
的救星 -
高级动画 : Velocity.JS
可以复杂动画序列实现,不仅局限于DOM
-
视频播放 : Video.JS
类似原生video
标签的使用方式,对低级浏览器使用flash
播放器
通信
常用方案
-
Reqwest
用于浏览器异步HTTP
请求。支持xmlHttpRequest, JSONP, CORS
,JSONP
,稳定性高,IE6+
支持,Promise/A
和CommonJS
约束 -
qwest
代码少、支持XMLHttpRequest2、CORS
跨域、支持高级数据类型(ArrayBuffer、Blob、FormData
)
专业领域
- socket.io
实时性高,支持二进制数据流,智能自动回退支持,且支持多种后端语言
工具包
-
es5-shim
提供ES3
环境下的ES5
支持 -
es6-shim
提供ES5
环境下的ES6
支持 -
underscore
提供兼容IE6+
的扩展功能函数 -
Lodash
是underscore
的高性能版本,方法多为runtime
编译出来的 -
响应式导航 : responsive-nav.js
一个很小的JS插件,压缩之后仅有1.7KB,能帮你创建针对小屏幕的可切换式导航 -
stickUp.js
一个jQuery
插件,能让页面目标元素“固定”在浏览器窗口的顶部,即便页面在滚动,目标元素仍然能出现在设定的位置。 -
unslider.js
一个超小的(不到3kb
)jQuery
轮播(slider
) 插件。支持主流浏览器、键盘导航、自动调整高度和响应式布局。
模板
-
基于字符串的模板(
String-based
)
dustjs、hogan.js、dot.js
-
基于
DOM
的模板(DOM-based
)
angularjs、vuejs、knockout
-
活动模板(
Living Template
)
RegularJS、RactiveJS、htmlbar
组件
-
Bootstrap
封装了常用的组件,是目前最火的组件解决方案,具有移动端first
的流式栅格系统,由sass
组织,可定制UI
-
Foundation
在国内知名度不高,具有移动端first
的流式栅格系统,由sass
组织,可定制UI
-
Flat UI
[Flat UI
] 是基于Bootstrap
做的Metro
化改造,由Designmodo
提供。Flat UI
包含了很多Bootstrap
提供的组件,但是外观更加漂亮。在此强烈推荐! -
bootstrap-switch
Bootstrap Switch
是对Bootstrap
控件的扩充。基于选HTML
中基本的选择框控件实现只有开和关两种状态的单选按钮。 -
iCheck
基于jQuery
或Zepto
, 让不同浏览器下的复选框(checkboxes
和单选按钮(radio button
)更美观、功能更强。 -
bootstrap-wysiwyg
为Bootstrap
定制的微型(5kb
)所见即所得(What you see is what you get
)富文本编辑器 -
chart.js
6种图表类型,基于HTML5 canvas
技术,支持所有现代浏览器,并且针对IE7/8
提供了降级替代方案,不依赖任何外部工具库,轻量级(压缩之后仅有4.5k
),并且提供了加载外部参数的方法 -
messenger
非常酷的弹框组件,压缩之后仅有2.5kb
,依赖于jQuery
、underscore
、backbone
-
bootstrap-datetimepicker
日期时间选择器,依赖于bootstrap
的下拉菜单组件 (dropdowns.less
) 的某些样式,还有bootstrap
的sprites
(sprites.less and associated images
) 中的箭头图标。 -
Headroom.js
为页面顶部多留些空间。在不需要页头时将其隐藏,例如向下滚动页面时,隐藏头部导航栏,向上滚动式再显示出来 -
Button
高度可定制的、免费并且开源的按钮CSS
样式库,部分功能需要依赖jquery
,图标字体需要依赖font-awesome
路由
-
page.JS
类似Express.Router
的路由规则的前端路由库 -
Director.JS
可以前后端使用同一套规则定义路由 -
Stateman
处理深层复杂路由的独立路优库 -
crossroad.JS
老牌路由库,API
功能较为繁琐
最后推荐一个框架选型网站 https://www.javascripting.com,该网站根据不同的需求的选择,给出当下流行的框架选型