javascript进度条,js进度条代码超简单

用javascript写的进度条，怎么获取进度条的值，按百分比显示出来？

s[0].style.width = 100 - r / i * 100 + "%";

该代码不就是设置进度条的么

如果你能更改页面 你在标签中这样写：

h5(资料完整度span id="wz_jd"/span)/h5

然后在你的JS中

s[0].style.width = 100 - r / i * 100 + "%";

的下面 写上:

document.getElementById("wz_jd").innerHTML = 100 - r / i * 100 + "%";

不就OK了么

注意:你的JS中哪儿有那行代码 就在那行下面 追加

如果不能更改页面就在那行代码下面 这样写：

document.getElementsByTagName("h5")[0].innerHTML = "(资料完整度"+ (100 - r / i * 100) + "%)";

里面的0 表示是第1个h5标签 如果你有多个 自己进行更改

相关问答

Q1: 如何用 javascript 做一个高逼格的进度条

给你思路，定义一个块为进度条

然后设定背景图片，就是进度条位置

然后js控制图片位置增加，

style.backgroundPosition="10 0";

[img]

Q2: 如何用JavaScript打造0.1%精度的进度条？

单进图条模式需要进度条长度为1000px的整数倍，

多进度条模式方法就多了，以两根进度条为例来表达的话可以第一根进度条表示1/100的精度，只要长度为100px的整数倍。第二个进度条的精度为1/10，长度需要为10px的整数倍。动画效果为第二根进度条满了第一根进度条进度加1就好了，这样组合起来就可以达到表示1/1000精度的效果。

当然，如果布局有限制直接将值表示在进度条上就行了，前端基本没有多少会刻意的要求动画精度吧。

Q3: 怎么编程javascript进度条

其实所谓的进度条，你可以看成是连个div，比如

div id="div1"

div id="div2"/div

/div

然后给div1和div2定义一样的高度，div1的背景色设置成宽度100%，div2的宽度分成五分，每份20%，div1的宽度初始状态是0，当你完成一份的时候的时候宽度改为20%，背景色设置为比div1稍微深一些的颜色，没当完成一份就增加20%的宽度（js控制宽度），这样就完成了进度条功能