Bootstrap 3之美07-插件Collapse、Accordion、Modal、Tab、Tooltip、Alert、Carousel类似Page Header, Breadcrumbs, Dropdowns等，都是Bootstrap的组件，是静态的。如果涉及到交互，Bootstrap提供了插件。这些插件包括：
○ 过渡效果： bootstrap-transition.js○ 模态对话框：bootstrap-modal.js○ 下拉项：bootstrap-dropdown.js......
这些插件可以单独引入到页面。而在bootstrap.js或bootstrap.min.js文件中已经包含了所有的插件。
本篇主要包括：
■ 如何使用Bootstrap插件■ Collapse■ Accordion■ Modal■ Tab■ Tooltip■ Alert■ Carousel
□ 如何使用Bootstrap插件
1、通过调用属性API
<a href="#" class="btn" data-toggle="dropdown"></a>
data-toggle是Bootstrap的专用属性，它的值对应插件的名称。
另外，data-toggle属性需要搭配data-target一起使用。data-target也是Bootstrap的专用属性，用来指定控制对象，它的属性值是一个jQuery选择符。比如：
<button data-toggle="modal" data-target="#id" class="btn"></button>
<div id="id" class="modal hide fade"></div>
如果想禁用属性API
$('body').off('.data-api');
如果想禁用某个属性API，比如禁用alert的属性API
$('body').off('.alert.data-api');
2、通过调用javascript的API
显示下拉菜单
$('.btn').dropdown();
显示模态对话框
$('.btn').click(function(){
$('#id').modal({
backdrop: false,
keyboard: false
});
})
Bootstrap的插件方法参数也可以是特定意义的字符串。比如：
$('#id').modal('hide');
使用Constructor属性来访问插件
var temp = $.fn.modal.Constructor
使用data方法访问插件
$('[rel = modal]').data('modal')
如果Boostrap与其它UI框架发生命名冲突，可以调用noConflict方法来获取插件
var bootstrapmodal = $.fn.modal.noConflict();
□ Collapse
点击按钮或链接等，显示或隐藏某个区域，比如div。
<div class="row">
<ul class="nav nav-pills navbar-default">
PRe style="font-size: 11px; font-family: consolas,'Courier New',courier,monospace; width: 100%; marg