js 实现多条数据进行计时
时间: 2024-01-14 10:03:25 浏览: 56
可以使用 JavaScript 中的 setInterval() 函数来实现多条数据的计时,具体步骤如下:
1. 定义一个数组,存储需要计时的数据。
2. 使用 setInterval() 函数设置一个计时器,每隔一定时间执行一次函数,这个函数用来遍历数组中的每一项数据,并对其进行计时操作。
3. 在计时器函数中,遍历数组中的每一项数据,然后对其进行计时操作。可以使用 Date() 对象来获取当前时间,然后计算出与起始时间的时间差,并将其显示在页面中。
示例代码如下:
```javascript
// 定义需要计时的数据
let data = [
{name: '数据1', startTime: new Date()},
{name: '数据2', startTime: new Date()},
{name: '数据3', startTime: new Date()},
];
// 定义计时器函数
function timer() {
// 遍历数组中的每一项数据
for (let i = 0; i < data.length; i++) {
// 计算当前时间与起始时间的时间差
let diff = new Date() - data[i].startTime;
// 将时间差显示在页面中
document.getElementById(`data-${i+1}`).innerText = `${data[i].name}:${Math.floor(diff/1000)} 秒`;
}
}
// 设置计时器,每隔 1 秒执行一次函数
setInterval(timer, 1000);
```
在页面中,需要为每一项数据设置一个 ID,以便在计时器函数中获取并显示时间。比如:
```html
<div id="data-1"></div>
<div id="data-2"></div>
<div id="data-3"></div>
```
这样,就可以实现多条数据的计时了。