如何检查表中的值是否与其他突出显示单元格的下一个值串联

Question

我有一个表，它是由用户添加的，必须从中选择列，每次用户输入新值时，都应该检查to值是否与下一个from值匹配，否则应该突出显示单元格。它应该是纯javascript。

在此处输入链接描述

<table class="table">
<thead>
<tr>
<th>From</th>
<th>To</th>
</tr>
</thead>
<tbody>
<tr>
<td>0</td>
<td>50</td>
</tr>
<tr>
<td>50</td>
<td>200</td>
</tr>
<tr>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>310</td>
<td>400</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
</tr>
<tr>
<td>500</td>
<td>800</td>
</tr>
<tr>
<td>850</td>
<td>978</td>
</tr>
<tr>
<td>978</td>
<td>1000</td>
</tr>
</tbody>
</table>
function GetCellValues() 
{ 
var table = document.getElementById('mytable'); 
for (var i= 0, i= table.rows.length; i++) 
{ 
if(table.cell[i]==table.cell[i+1){
table.cell[i].style.color = red;
}}}

Answer 1

例如，您可以遍历行，然后检查行中当前的第一个单元格是否等于上一个最后一个单元格行。类似于：

function GetCellValues() {
var table = document.getElementById("mytable");
let previous = "0";
for (let i = 1; i < table.rows.length; i++) {
if (previous !== table.rows[i].cells[0].innerText) {
table.rows[i].cells[0].style.color = "red";
}
previous = table.rows[i].cells[1].innerText;
}
}
GetCellValues();

table,
th,
td {
border: 1px solid black;
}

<table id="mytable" class="table">
<thead>
<tr>
<th>From</th>
<th>To</th>
</tr>
</thead>
<tbody>
<tr>
<td>0</td>
<td>50</td>
</tr>
<tr>
<td>50</td>
<td>200</td>
</tr>
<tr>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>310</td>
<td>400</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
</tr>
<tr>
<td>500</td>
<td>800</td>
</tr>
<tr>
<td>850</td>
<td>978</td>
</tr>
<tr>
<td>978</td>
<td>1000</td>
</tr>
</tbody>
</table>