原生js和JQuery库结合使用
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--视口的设置:视口的宽度和设备一致,默认的缩放比例和PC端一致,用户不能自行缩放-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<title>Title</title>
<script src="jquery.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="progress">
<div class="progress-bar progress-bar-waring progress-bar-striped active" style='width:0%'></div>
</div>
</div>
<script>
s=0;
v=2;
sobj=setInterval(function(){
s=s+v;
if(s>=100){
clearInterval(sobj);
}
$('.progress-bar').html(s+'%').css({width:s+'%'});
},100)
</script>
</body>