所以我在使用 js 删除 HTML 表中的所有数据而不删除 header 时遇到问题。这是我的 HTML:
<html>
<title>Z80 Opcodes</title>
<body>
<input type="text" id = "input" value = "">
<button onClick = "hex()">Hex</button>
<button onClick = "bin()">Bin</button>
<button onClick = "assem()">Assembly</button>
<button onClick = "find()">Find</button>
<table id = "out" style="width:100%">
<thead>
<th align="left">Binary</th>
<th align="left">Hex</th>
<th align="left">Assembly</th>
<th align="left">Description</th>
</thead>
<tbody id="tb">
</tbody>
<script src = "js/script.js">
</script>
</body>
</html>
这是 script.js:
var id = document.getElementById("out");
var ab = "";
var row;
var table = ['0000000000nopno operation', '0000000101ld (bc), **loads ** into BC'];
var bin = ['00000000', '00000001'];
var hex = ['00', '01'];
var assembly = ['nop', 'ld (bc), **'];
var description = ['no operation', 'loads ** into BC'];
l = table.length;
function find() {
row = id.insertRow(0);
for (i=0;i <=l-1;i++) {
ab = table[i];
if (ab.includes(document.getElementById("input").value)) {
row = id.insertRow(-1);
cell1 = row.insertCell(0);
cell2 = row.insertCell(1);
cell3 = row.insertCell(2);
cell4 = row.insertCell(3);
cell1.innerHTML = bin[i];
cell2.innerHTML = hex[i];
cell3.innerHTML = assembly[i];
cell4.innerHTML = description[i];
}
}
}
我省略了很多数组条目,因为它们几乎包含了 z80 微处理器的完整指令集。
此代码的作用(基本上)是从用户获取输入,如果数组 table
包含该输入,则它从 bin
、hex 获取相应的值
、assemble
和 description
并在表 out
中为每个列分配一列,然后为数据添加一行。但是,在将另一组值附加到表中而不删除 thead
之前,我似乎找不到一种方法来删除 tbody
中的所有行。我在网上搜索了一些解决方案,但没有一个有效。他们要么删除了thead
,要么导致了某种错误(如果你问的话我会给出例子)。我正在使用 Google Chrome 版本 63.0.3239.132 网络浏览器来运行我的代码。
正如你可能看到的,我对 js 和 HTML 很陌生
有什么想法我做错了什么吗?
~贾赫迪奇
最佳答案
首先你必须关闭你的<table>
标签</table>
这是清理 table 的方法。
$('#remove').on('click', ()=>{
$('#tb').empty()
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id = "out" style="width:100%">
<thead>
<th align="left">Binary</th>
<th align="left">Hex</th>
<th align="left">Assembly</th>
<th align="left">Description</th>
</thead>
<tbody id="tb">
<tr>
<th>01010101</th>
<th>1231:sdf:sdf42</th>
<th>213123</th>
<th>description</th>
</tr>
</tbody>
</table>
<button id="remove">
clear
</button>
关于javascript - 使用 JS 删除 HTML 表格中除标题之外的所有行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48468672/