写一个js删除<table>的<tr>的代码

可以使用以下代码来删除 `<table>` 中的 `<tr>` 元素：

// 获取table元素
const table = document.querySelector('table');

// 获取所有的tr元素
const rows = table.getElementsByTagName('tr');

// 从后往前遍历tr元素，依次删除
for (let i = rows.length - 1; i >= 0; i--) {
  table.deleteRow(i);
}

这段代码首先获取到 `table` 元素，然后通过 `getElementsByTagName` 方法获取到所有的 `<tr>` 元素。接着从后往前遍历所有的 `<tr>` 元素，使用 `deleteRow` 方法删除每一个 `<tr>` 元素。由于是从后往前遍历，因此不会影响到前面的元素。

相关问题

删除<table>中的<tr>元素

要删除`<table>`中的`<tr>`元素，可以使用JavaScript来实现。具体步骤如下：

1. 获取`<table>`元素。

var table = document.getElementsByTagName('table')[0];

2. 获取所有的`<tr>`元素。

var trList = table.getElementsByTagName('tr');

3. 循环遍历`<tr>`元素，并将其从`<table>`中删除。

for (var i = 0; i < trList.length; i++) {
  table.removeChild(trList[i]);
}

完整的代码如下：

var table = document.getElementsByTagName('table')[0];
var trList = table.getElementsByTagName('tr');
for (var i = 0; i < trList.length; i++) {
  table.removeChild(trList[i]);
}

<h1>Shopping Cart</h1> <table> <thead> <tr> <th>图片</th> <th>名称</th> <th>价格</th> <th>数量</th> <th>操作</th> </tr> </thead> <tbody> <tr v-for="cart in carts" :key="$route.query.id"> <td title='' class="one-line"><span class="checkbox checkbox"></span>&nbsp;&nbsp; <img :src="cart.img | fmtImg" class="thumbnail-goods">&nbsp; </td> <td> {{ cart.name }}</td> <td>{{ cart.onlineprice }}</td> <td>{{ cart.num }}<input type="number" class="input-num"></td> <td><span @click="delCart($route.query.id)" class="btn-text">删除</span> <span class="btn-text">结算</span></td> </tr> </tbody> </table> <div class="banner-pay"> <span>￥&nbsp;{{getTotalPrice.totalPrice}}</span> &nbsp;&nbsp;&nbsp;&nbsp; <span @click="getTotalPrice($route.query.id)" class="btn-pay">结&nbsp;&nbsp;算</span> </div> </div>美化界面

很抱歉，我作为一名语言模型，无法展示界面，只能理解您的代码内容和结构。如果您需要美化界面，可以尝试使用CSS样式表，并为表格添加一些美化效果，例如添加一些边框、背景颜色、居中等。同时，您也可以使用JavaScript来为页面添加一些动态效果，例如添加鼠标悬停效果、点击事件等。如果您需要更具体的建议，可以提供更多的代码和详细的要求，我会尽力帮助您。