无法删除带有索引的表内的 tr 元素

Question

我正在尝试创建一个表，在其中输入对象中的元素。可以在页面上呈现的元素数量有限。因此，为了查看更多内容，您将单击下一个/上一个，以查看其他“页面”。问题是，我想删除不显示的索引。底部的逻辑是我设置最小和最大索引并查看不同的页面，我会将这些数字增加 10（以在页面上获得 10 个结果），但是当我单击下一步按钮时，我想删除 0 - 10 和只有 10 - 20 个，但 table.deleteRow(index) 不执行任何操作。（但 table.deteteRow(1) 确实有效）function fill(){        prices.forEach((element,index) =>{            const table = document.querySelector("table");            const tr = document.createElement("tr");            tableItems.appendChild(tr);                                   if(index >= min && index < max){                                const type = document.createElement("td");                const name = document.createElement("td");                const hours = document.createElement("td");                const photos = document.createElement("td");                const place = document.createElement("td");                const price = document.createElement("td");                type.innerHTML = element.type;                name.innerHTML = element.name;                hours.innerHTML = element.hours;                photos.innerHTML = element.photos;                place.innerHTML = element.place;                price.innerHTML = element.price;                tr.appendChild(type);                tr.appendChild(name);                tr.appendChild(hours);                tr.appendChild(photos);                tr.appendChild(place);                tr.appendChild(price);            }            if(index > max){                table.deleteRow(index);            }                //        });    }    buttonRight.addEventListener("click",()=>{        min = max;        max = max + 10;        fill();    });    buttonLeft.addEventListener("click",()=>{        max = min;        min = min -10;        fill();    });

Answer 1

您始终应该删除索引为 0-9 的行，并且不应该更改索引号，因为表中始终有 10 行。似乎当您单击“下一步”按钮时，简单的方法是在调用填充函数之前从表中删除所有 tr 。