function home() {
// 1. 获取元素
// 2.判断是否有数据返回
const xhr = new XMLHttpRequest();
// 设置响应体数据的类型
xhr.responseType = 'json';
// 2.初始化 设置类型与 url
xhr.open('GET', 'https://57uz648984.goho.co/stopcar/shouye');
// 3.发送
xhr.send();
// 4.事件绑定
xhr.onreadystatechange = function () {
// 判断
if (xhr.readyState === 4) {
if (xhr.status >= 200 && xhr.status < 300) {
// 处理服务端返回的结果
// 自动数据转换
// 往tbody 里面创建行
console.log(xhr.response.data);
var forms = document.querySelector('tbody');
var bianh = 0;
for (var i = 0; i < xhr.response.data.length; i++) {
// 创建 tr 行
var tr = document.createElement('tr');
forms.appendChild(tr);
bianh++;
// 在行里面创建单元格 td 单元格的数量取决于每个对象里面的属性个数 for循环遍历对象 datas[i]
for (let k in xhr.response.data[i]) {
if (k === 'ctime' && bianh === 1) {
var td = document.createElement('td');
var inputTime1 = +new Date(xhr.response.data[i][k]);//返回的是用户输入时间总的毫秒数
// var timClass = document.getElementsByClassName('tim');
var nowTime = +new Date(); //返回的是当前时间总的毫秒数
var times = (nowTime - inputTime1) / 1000; //times是剩余时间总的秒数
var d = parseInt(times / 60 / 60 / 24);//天
var h = parseInt(times / 60 / 60 % 24);//时
h = h + (d * 24);
h = h < 10 ? '0' + h : h;
var m = parseInt(times / 60 % 60);//分
m = m < 10 ? '0' + m : m;
var s = parseInt(times % 60);//秒
s = s < 10 ? '0' + s : s;
td.innerHTML = h + ':' + m + ':' + s;
}
tr.appendChild(td);
}
}
}
}
}
}
引用GPT回答
在该代码段中，有一个可能会导致问题的潜在问题是 tr.appendChild(td) 应该在 for 循环中，而不是在 if 语句块中。这是因为如果当前对象的某个属性不是 'ctime'，则代码不会创建一个新的单元格，从而可能导致单元格数量不正确的问题。
此外，如果数据量很大，则往 tbody 中添加行和单元格可能会影响性能。为了避免这个问题，可以使用 DocumentFragment 来保存创建的行和单元格，然后在最后一次操作 DOM 时将其添加到 tbody 中。
遇到什么问题了呢？
不知道你这个问题是否已经解决, 如果还没有解决的话: