bootstrap插件概览
在前面布局组件章节中所讨论的组件仅仅是个开始。bootstrap自带的12种jquery插件，扩展了功能，可以给站点添加更多的互动。即使您不是一名高级的js开发人员，
你也可以学习bootstrap的js插件。利用bootstrap数据api(bootstrap data api),大部分的插件可以在不编写任何代码的情况被触发。
站点引用bootstrap插件的方式有两种：
单独引用:使用bootstrap的个别的*.js文件。一些插件和css组件依赖于其他插件。如果您单独引用插件，请先确保弄清楚这些插件之间的依赖关系。
编译(同时)引用:使用bootstrap.js或压缩版的bootstrap.min.js
不要尝试同时引用这两个文件，因为bootstrap.js和bootstrap.min.js都包含了所有的插件。
所有的插件依赖于jquery。所以必须在插件文件之前引用jquery.请访问bower.json.查看boostrap当前支持的jquery版本。
data属性
你可以仅仅通过data属性api就能使用所有的bootstap插件，无需写一行javascript代码。这是bootstrap中的一等api，也应该是你的首选方式。
话又说回来，在某些情况下可能需要将功能关闭。因此，我们还提供了关闭data属性api的方法，即解除以data-api为命名空间并绑定在文档上的事件。就像下面这样：
$(document).off('.data-api')
如需关闭一个特定的插件，只需要在data-api命名空间前加上该插件的名称作为命名空间即可，如下所示：
$(document).off('.alert.data-api')
编程方式的api
我们为所有bootstrap插件提供纯javascript方式的api。所有公开的api都支持单独或链式调用方式，并且返回其所有操作的元素集合(注：和jquery的调用形式一致)。
$('.btn.danger').button('toggle').addclass('fat')
导入【一次性导入】
bootstrap提供了一个单一的文件，这个文件包含了bootstrap的所有javascript插件，即bootstrap.js（压缩版本：bootstrap.min.js）
【单独导入】
为方便单独导入特效文件，bootstrap提供了12种javascript插件，他们分别是：
☑ 动画过渡（transitions）:对应的插件文件“transition.js”
☑ 模态弹窗（modal）:对应的插件文件“modal.js”
☑ 下拉菜单（dropdown）：对应的插件文件“dropdown.js”
☑ 滚动侦测（scrollspy）：对应的插件文件“scrollspy.js”
☑ 选项卡（tab）：对应的插件文件“tab.js”
☑ 提示框（tooltips）：对应的插件文件“tooltop.js”
☑ 弹出框（popover）：对应的插件文件“popover.js”
☑ 警告框（alert）：对应的插件文件“alert.js”
☑ 按钮（buttons）：对应的插件文件“button.js”
☑ 折叠/手风琴（collapse）：对应的插件文件“collapse.js”
☑ 图片轮播carousel：对应的插件文件“carousel.js”
☑ 自动定位浮标affix：对应的插件文件“affix.js”
data属性可以仅仅通过 data 属性 api 就能使用所有的 bootstrap 插件，无需写一行 javascript 代码。这是 bootstrap 中的一等 api，也应该是首选方式。
话又说回来，在某些情况下可能需要将此功能关闭。因此，还提供了关闭 data 属性 api 的方法，即解除以 data-api 为命名空间并绑定在文档上的事件。就像下面这样：
$(document).off('.data-api')
另外，如果是针对某个特定的插件，只需在 data-api 前面添加那个插件的名称作为命名空间，如下：
$(document).off('.alert.data-api')
apibootstrap为所有插件提供了纯 javascript 方式的 api。所有公开的 api 都是支持单独或链式调用方式，并且返回其所操作的元素集合，和jquery的调用形式一致
$('.btn.danger').button('toggle').addclass('fat')
所有方法都可以接受一个可选的 option 对象作为参数，或者一个代表特定方法的字符串，或者什么也不提供（在这种情况下，插件将会以默认值初始化）
$('#mymodal').modal()                      // 以默认值初始化$('#mymodal').modal({ keyboard: false })   // initialized with no keyboard$('#mymodal').modal('show')                // 初始化后立即调用 show 方法
每个插件还通过 constructor 属性暴露了其原始的构造函数：$.fn.popover.constructor。如果想获取某个插件的实例，可以直接通过页面元素获取：$('[rel=popover]').data('popover')
【默认设置】
每个插件都可以通过修改其自身的 constructor.defaults 对象从而改变插件的默认设置：
$.fn.modal.constructor.defaults.keyboard = false // 将模态框插件的 `keyboard` 默认选参数置为 false
【避免命名空间冲突】
某些时候可能需要将 bootstrap 插件与其他 ui 框架共同使用。在这种情况下，命名空间冲突随时可能发生。如果不幸发生了这种情况，可以通过调用插件的 .noconflict 方法恢复其原始值
var bootstrapbutton = $.fn.button.noconflict() // return $.fn.button to previously assigned value$.fn.bootstrapbtn = bootstrapbutton            // give $().bootstrapbtn the bootstrap functionality
【事件】
bootstrap 为大部分插件所具有的动作提供了自定义事件。一般来说，这些事件都有不定式和过去式两种动词的命名形式，例如，不定式形式的动词（例如 show）表示其在事件开始时被触发；而过去式动词(如shown)表示在动作执行完毕之后被触发。
所有 bootstrap 事件的名称都采用命名空间方式。所有以不定式形式的动词命名的事件都提供了 preventdefault 功能。这就赋予在动作开始执行前将其停止的能力
$('#mymodal').on('show.bs.modal', function (e) {  if (!data) return e.preventdefault() // 阻止模态框的展示})
过渡效果bootstrap框架默认给各个组件提供了基本动画的过渡效果，如果要使用，有两种方法：
☑ 调用统一编译的bootstrap.js；
☑ 调用单一的过渡动画的javascript插件文件transition.js
transition.js文件为bootstrap具有过渡动画效果的组件提供了动画过渡效果。不过需要注意的是，这些过渡动画都是采用css3来实现的，所以ie6-8浏览器是不具备这些过渡动画效果
默认情况之下，bootstrap框架中以下组件使用了过渡动画效果：
☑ 模态弹出窗（modal）的滑动和渐变效果；
☑ 选项卡（tab）的渐变效果；
☑ 警告框（alert）的渐变效果；
☑ 图片轮播（carousel）的滑动效果
transition.js 是针对 transitionend 事件的一个基本辅助工具，也是对 css 过渡效果的模拟。它被其它插件用来检测当前浏览器对是否支持 css 的过渡效果
通过下面的代码可以在全局范围禁用过渡效果，并且必须将此代码放在transition.js(或bootstrap.js或bootstrap.min.js)后面，确保在js文件加载完毕后再执行下面代码
$.support.transition = false
以上就是bootstrap插件的介绍与使用的详细内容。