前台JS遍历Table的所有单元格数据内容

在日常开发过程中为了减少与后台服务器的交互次数，大部分的功能都会放到前台使用JS来完成。

例如:一个表中有ID(FOCUS_SEQ)和Name(COLUMNCTRL)两个字段，其中ID是自定义连续增长的数字，Name是不同的字符串，表中的数据假设就只有八条，不会新增也不会删除。类似如下；

现在要写一个方法，方法的功能:要求输入一个Name的值并返回这个Name对应下一个Name的值:

要实现这个方法的思路是要将输入的Name值作为参数在这个表中查询出对应的ID，再将ID+1作为参数在这个表查询出对应的Name的值;

SQL: select Name from Table_Name where ID=(select ID from Table_Namewhere Name=@Name)+1

这个思路看似是实现了方法，但是写在后台每次执行方法的时候都会执行这句SQL语句与服务器数据库进行交互加大了服务器的压力并且也会造成页面刷新给用户带来不好的体验。

若在前台JS端使用AJAX调用一般处理程序是解决了会刷新页面的问题，但是每次调用的时候还是会执行SQL语句与数据库进行交互。

那么既然表中的ID是自定义连续增长的数字，数据也不会轻易的修改那能否在第一次执行这个方法的时候就将这张表中的数据全部查询出来保存在页面中，在后续再次调用方法时就不用从数据库中查询了，直接从保存的数据中获取到下一个Name的值？

SQL：select Name from Table_Name Order by ID(将数据根据ID进行排序全部查询带出)

依照这个思路，我将数据在第一次调用方法时就全部查询出来并绑定到页面上的一个GridView中(可以将GridView控件在页面中隐藏，仅保存数据使用)

那么就要使用JS代码来遍历GridView中的数据来与传入的Name值判断是否相等，若相等则在GridView中的Rows+1就是下一个Name的值。

//传入Name的值遍历GropView匹配获取下一个Name的值

    function EnterScalar(COLUMNCTRL) {

        var gdview = document.getElementById("GV_List");

        if (gdview != null) {

            for (var i = 1; i < gdview.rows.length; i++) {     //遍历Table中的所有ROW

                for (var j = 0; j < gdview.rows[i].cells.length; j++) { //遍历ROW的每一列

                    if (gdview.rows[i].cells[j].innerText == COLUMNCTRL) { //判断是否相等

                        alert(gdview.rows[i + 1].cells[j].innerText);

                    };

                }

            }

        }

    }

这样就完美的解决了程序与后台服务器和数据库交互次数过多以及页面会刷新的问题了。我可真是个小机灵哈哈哈~

巴特西

前台JS遍历Table的所有单元格数据内容

最新文章

热门文章