• js比对两个table的tbody的数据,一个字段是否有相同的,或其他


    <html>
    <header>
    
    </header>
    
    <body>
    
        <!-- 装备清单 -->
        <div id="zbqd">
                <table border="1" cellspacing="0"
                    style=" border-collapse: collapse;font-size: 14px;">
                    <thead>
                        <tr>
                            <th colspan="3" height="40px;" style=" 295px;">装备清单</th>
                            <th colspan="1" align="center" style=" 70px;">
                                <input type="button" id="ok" class="optInput" value="调拨" onclick="pushEq()" />
                            </th>
                        </tr>
                    </thead>
                    <tbody id="qdtbody">
                        <tr>
                            <th align='center' style=' 120px;'>装备名称</th>
                            <th align='center'>数量</th>
                            <th align='center' style='47px'>调拨数</th>
                            <th align='center' style=' 156px;'>存放地址</th>
                        </tr>
                        
                        <tr id="1">
                            <td align='center'>信号枪</td>
                            <td align='center'>25</td>
                            <td align='center'><input type='text' style=' 40px;height: 30px;' id='qd1' value='0' /></td>
                            <td align='center'>西湖路</td>
                        </tr>
                        <tr id="2">
                            <td align='center'>装备包</td>
                            <td align='center'>30</td>
                            <td align='center'><input type='text' style=' 40px;height: 30px;' id='qd2' value='0' /></td>
                            <td align='center'>起义路</td>
                        </tr>
    
                        <tr id="3">
                            <td align='center'>探测器</td>
                            <td align='center'>12</td>
                            <td align='center'><input type='text' style=' 40px;height: 30px;' id='qd3' value='0' /></td>
                            <td align='center'>起义路</td>
                        </tr>
                        
                    </tbody>
                </table>
            </div>
            <br>
    
            <div id="zdzb">
                    <table border="1" cellspacing="0" style=" border-collapse: collapse; 300px;">
                        <thead>
                            <tr>
                                <th colspan="4" height="40px;">战斗单元配置标准</th>
                            </tr>
                        </thead>
                        <tbody id="zdzbtbody">
    
                                <tr>
                                    <th align='center' style=' 120px;'>装备名称</th>
                                    <th align='center' style='47px'>数量</th>
                                </tr>
                                
                                <tr>
                                    <td align='center'>信号枪</td>
                                    <td align='center'>10</td>
                                </tr>
                                <tr>
                                    <td align='center'>装备包</td>
                                    <td align='center'>50</td>
                                </tr>
    
                        </tbody>
                    </table>
                </div>
                <br>
    
                <input type="button" id="ok" class="optInput" value="确认" onclick="pushEq()" />
    
                <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
                <script src="demo.js"></script>
    
    </body>
    </html>
    demo.js
    function pushEq(){
    
        // var qdtbody = document.getElementById("qdtbody");
        // var qdrows = qdtbody.rows;
    
        // 用战斗装备配置的去比对   装备清单的数据
        var tbody = document.getElementById("zdzbtbody");
        var rows = tbody.rows;
    
        for(var i=1; i<rows.length;i++){
            var cells=rows[i].cells;
            
            var a;  //装备名称
            var b;  //战斗装备数量
    
            for(var j=0;j<cells.length;j++){
                if(j==0){
                    a = cells[j].innerHTML;
                    console.log("战斗装备名称: "+a);
    
                }
                if(j==1){
                    b = cells[j].innerHTML;
                    console.log(b);
                }
                
            }
    
            var qdtbody = document.getElementById("qdtbody");
            var qdrows = qdtbody.rows;
            for(var k=1; k<qdrows.length; k++){
                var qdcells=qdrows[k].cells;
    
                // 装备清单
                var aa;
                var bb;
                for(var l=0;l<qdcells.length;l++){
    
                    if(l==0){
                        aa = qdcells[l].innerHTML;
                    }
                    if(l==1){
                        bb = qdcells[l].innerHTML;
                        continue;
                    }
                }
    
                if(a == aa && parseInt(b)<parseInt(bb)){
                    console.log("黄色字体表示匹配战斗单元标准并且数量满足要求");
                    
                    var qd = document.getElementById(k);
                    qd.style.color="yellow";
                    
                    document.getElementById("qd"+k).value = b;
                }
    
                if(a == aa && parseInt(b)>parseInt(bb)){
                    console.log("蓝色字体表示在战斗单元配置中但是框定的范围里面没有该装备");
                    var qd = document.getElementById(k);
                    qd.style.color="blue";
                    
                    document.getElementById("qd"+k).value = b;
                }
    
                aa=""; bb="";
            }
    
            a=""; b="";
        }
    
    }
  • 相关阅读:
    计算任一输入的正整数的各位数字之和,并分析算法的时间复杂度
    10万数组去重,排序,找最多出现次数,(复杂度没有前一个博客好,随手写,有点烂)
    Maven环境搭建
    Tomcat内部结构及请求原理(转)
    Tomcat环境搭建
    斐讯面试记录—三线程交替打印ABC
    斐迅面试记录—SSL和TLS的区别
    斐迅面试记录—Http协议中的Header
    斐讯面试记录—强+软+弱+虚引用
    斐讯面试记录—TCP滑动窗口及拥塞控制
  • 原文地址:https://www.cnblogs.com/QW-lzm/p/12368160.html
Copyright © 2020-2023  润新知