用javascript对网页中两个表格内容逐项比对

怎么用js对网页中表格的内容进行逐项比对,如果不一样则让其背景变成红色。如图所示。... 怎么用js对网页中表格的内容进行逐项比对,如果不一样则让其背景变成红色。如图所示。 展开
 我来答
cmoooo
推荐于2018-04-26 · TA获得超过3587个赞
知道小有建树答主
回答量:741
采纳率:0%
帮助的人:672万
展开全部
<html>
<head>
<title>文档</title>
<style type="text/css">
body{
width:100%;
}
table{
width:100%;
margin-top:20px;
}
input{
width:100px;
height:30px;
}
</style>
<script type="text/javascript">
/**
在两个表格结构相同的情况下:

设表1的ID,也就是table标签的ID为“table1”;
表2的ID为table2;
**/
function testTable(){
var t1 = document.getElementById('table1');
var t2 = document.getElementById('table2');
var tRows = t1.rows.length;
var tCells = t1.rows[1].cells.length;
for(var i=1; i<tRows; i++){
for(var p=0; p<tCells; p++){
if(t1.rows[i].cells[p].innerHTML != t2.rows[i].cells[p].innerHTML){
t2.rows[i].cells[p].style.backgroundColor = '#F00';
}
}
}
}
</script>
</head>

<body>
<table border="1" cellspacing="0" cellpadding="0" id="table1">
    <tr>
        <th colspan="3">表头</th>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
    <tr>
        <td>4</td>
        <td>5</td>
        <td>6</td>
    </tr>
</table>
<table border="1" cellspacing="0" cellpadding="0" id="table2">
    <tr>
        <th colspan="3">表头</th>
    </tr>
    <tr>
        <td>1</td>
        <td>3</td>
        <td>3</td>
    </tr>
    <tr>
        <td>4</td>
        <td>5</td>
        <td>8</td>
    </tr>
</table>
<input type="button" value="检测" onClick="testTable()" />
</body>
</html>
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式