学习中对比了一下两者的差异，简单做了一个笔记。

CSS属性	Amase UI	Bootstrop	对比
基础	html:62.5%(10px);body:16px;h1:1.5倍	html:100%;body:14px;h1:36px	基本字体
打印	am-print-hide	visible-print-block	–
网格	am-u-sm/md/lg-* (等分：am-avg-sm/md/lg-*)	col-xs/sm/md/lg-*	amase有个等分
辅助	am-scrollable-horizontal(垂直滚动)、am-vertical-align-middle(垂直居中)、am-margin-*(margin值，同am-padding)	text-primary(文本颜色)、bg-primary(背景色)、center-block(内容居中)	–

总结：Amase UI在Bootstrop基础上添加了am-做前缀（大部分吧），整体上来说，“妹子”在样式上更具特色，更灵活一些。

---

JS插件	Amase UI	Bootstrop	对比
警告框	am-alert am-alert-success	alert alert-success	–
按钮交互	data-am-loading	data-loading-text	–
折叠面板	am-panel-group	panel	–
下拉	am-dropdown	dropdown	–
模态框	am-modal、am-modal-confirm	modal	–
提示框	data-am-popover属性	data-toggle属性	Bootstrop样式较多
进度条	$.AMUI.progress.start();调用	progress-bar 要给一个百分比	妹子做得更容易控制
轮播图	am-slider	slide	很明显妹子是比较多样的
侧边栏	data-am-offcanvas	无	更加适用于移动端的侧边导航效果
滚动侦测	监听滚动事件，data-am-scrollspy属性	只有导航有固定顶部	果然是移动
平滑滚动	在 $(window) 上调用 $().smoothScroll()方法。	无	–
固定元素	data-am-sticky	无	–
选项卡	文字不能选择，要设置user-select，但是里面的文字滑动效果不错	nav nav-tabs 标签页	–
日期组件	方向、高度、已选项、搜索选项、选项验证，样式和功能比较多(data-am-datepicker)	没有针对时间的组件	–
下拉选框	select data-am-selected	form-control	妹子提供了更多的选择，样式也更合理
实用工具	cookie、地图、全屏切换、本地存储、触控	–	–

总结：

Amase UI可以通过 Data API 进行操作，采用了data-am-*格式，在不对效果有特殊要求的情况下，完全可以；当然也可以通过js调用，中间可以对效果进行调整，采用了$().控件名()。

Amase UI在组件功能上更加完善，也越来越符合移动端开发需求

如果点击事件包含了其他相关事件，可以在click事件中添加新的控件触发事件：事件.控件名.amui，有个简单的例子，第一个采用data api ，后面采用js调用