网站建设系列是收集网站使用到的各种demo。包括 JavaScript 插件，JavaScript组件，常用 css 等多方面。
主要参考bootcdn，以及GitHub上的资源进行说明。如果时间允许，会将这些所有内容进行逐一对比。
一、最简版(demo1.html)
首先基于 bootstrap 组件来讲，在它的官网介绍中，有关于progress bar 的样式组件。当然是用它首先要引用 bootstrap.css。
基本样式就是如此，但是这仅仅只是一个静态的进度条。现在通过 jQuery 代码将其动起来（文件js/progress.js）。
核心源码代码
1. 设置当前进度：
结合官方给的HTML代码，不难看出该方法是设置进度条的值。调用时使用update(60)即可，当然，这是该插件的内部调用。
2. 例如设置为完成和重置进度条：
3. 外部调用的入口为：
这是典型的jQuery插件式写法，使用方法为
$(progressSelector).progressbar(参数)
方法内的前五行为获得 Progressbar 对象， 第七行当参数类型是数字时进行处理，也就是设置进度为多少。
第六行当参数类型是字符串时进行处理，其实能用来传参的两个字符串只能是（‘finish’ 和 ‘reset’），也就是该插件内部提供的这两个方法。
我的demo演示的效果是，当点击上传文件按钮时，进度条从0开始，一直到100%。
4. 该插件还提供一些 HTML 操作功能
看这段代码可以知道，HTML元素需要至少三个属性，
data-toggle='progressbar', 有该属性才能控制进度条；
data-target=selector， 该属性表示控制哪个进度条；
data-value=value, 该属性表示控制进度条到达什么值，也支持那两个字符串；
具体使用见图：
