网页写作习惯的改变

个人征信系统完成，花了一天时间导入了N多人的数据，自我欣赏了好几天，把所有认识的人都查了一下。难过的准确率，和不太满意的查找率。这是数据质量的问题不说了……后台还是使用asp写的，但是程序构成方法有了很大的转变，过去html直接加入asp代码的日子已经结束了。使用了所谓的webservices使后台编程的难度降低了很多，也减轻了服务器的负担。在这个ws里我使用了很简单的rest协议。通过这个协议，简单实现整个流程，发送一个id=****,获得一个xml文档回执，问题变得如此简单了，前台用javascript 获得数据一一放入到需要的地方。这种方法唯一会让人感到高兴的是：看到的页面都是.htm

两段代码

1、所有的事情交给浏览器做，当然页面间的全局变量最好的方法是Cookie。这样服务器获得数据后，无论什么页面随用随取，自由自在。

// 网上抄的 function  SetCookie(name,value) // 两个参数，一个是cookie的名子，一个是值 ... {    var Days = 1; //此 cookie 将被保存 1 天    var exp  = new Date();    //new Date("December 31, 9998");    exp.setTime(exp.getTime() + Days*24*60*60*1000);    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();} function  getCookie(name) // 取cookies函数         ... {    var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));    if(arr != null) return unescape(arr[2]); return null;} function  delCookie(name) // 删除cookie ... {    var exp = new Date();    exp.setTime(exp.getTime() - 1);    var cval=getCookie(name);    if(cval!=null) document.cookie= name + "="+cval+";expires="+exp.toGMTString();} // SetCookie ("xiaoqi", "3") // alert(getCookie('xiaoqi'));

 2、数据翻页代码 做成了 [上一页][1][2][3][4][5][6][7][8][下一页] 这类形式翻页只是对小数据量最好，我的100条数据很快,打数据量还是按原始方法，传来数据分成10页，无刷新翻页，速度自然是快的惊人。

 

function  ToPage(oArg) ... {        var oSize, oCount, oPosition, strList = '';        var oTarget = oArg;        var oTable = document.all['oTable'];        var oData = document.all['oData'];        var oRecordSet = oData.recordset;        oSize = oTable.dataPageSize;        oRecordSet.PageSize = oSize;        oCount = oRecordSet.PageCount;        oPosition = oRecordSet.AbsolutePage;        if (oTarget<1) ...{ oTarget = 1; }        if (oTarget>oCount) ...{ oTarget = oCount; }        while (oPosition!=oTarget) ...{            if (oPosition<oTarget) ...{                oRecordSet.AbsolutePage ++;                oPosition = oRecordSet.AbsolutePage;                oTable.nextPage();            } else ...{                oRecordSet.AbsolutePage --;                oPosition = oRecordSet.AbsolutePage;                oTable.previousPage();            }        }        var oPage = document.all['oPage'];        for (var i=1; i<=oCount; i++) ...{             strList += '[<a href= "javascript:ToPage(' + i + '); void 0;" class="a">';             strList += (oRecordSet.AbsolutePage!=i) ? i : '<b>' + oRecordSet.AbsolutePage + '</b>' ;             strList += '</a>]  ';        }        if (oRecordSet.AbsolutePage>1)        ...{            strList = '[<A HREF="javascript:ToPage('+(oRecordSet.AbsolutePage-1)+'); void 0;" class="a">上一页</A>]  ' + strList        }        if (oRecordSet.AbsolutePage != oCount)        ...{            strList =  strList + '[<A HREF="javascript:ToPage('+(oRecordSet.AbsolutePage+1)+');void 0;" class="a">下一页</A>]'        }        //strList = strList.substr(0, strList.length-12);        oPage.innerHTML = strList;    }      function  setList()  ... {                var oSize, oCount, strList = '';        var oTable = document.all['oTable'];        var oData = document.all['oData'];        var oRecordSet = oData.recordset;        oSize = oTable.dataPageSize;        oRecordSet.PageSize = oSize;        oCount = oRecordSet.PageCount;        var opagecount = document.all['opagecount'];        $('opagecount').innerHTML ='     搜索共得到<font color="#FF0000">' + oRecordSet.recordcount + '</font>个结果,共<font color="#FF0000">' + oCount + '</font>页';                var oPage = document.all['oPage'];        for (var i=1; i<=oCount; i++) ...{             strList += '[<a href="javascript:ToPage(' + i + '); void 0;" class="a">';             strList += (oRecordSet.AbsolutePage!=i) ? i : '<b>' + i + '</b>' ;             strList += '</a>]  ';        }        if (oCount > 1)        ...{            strList = strList + '[<A HREF="javascript:ToPage('+(oRecordSet.AbsolutePage+1)+'); void 0;" class="a">下一页</A>]'        }        //strList = strList.substr(0, strList.length-12);        oPage.innerHTML = strList;    }      // <table id="oTable" width="90%" align="center" border="0" cellPadding="0" cellSpacing="0" dataSrc="#oData" dataPageSize="10">      // <span id="oPage"></span>

获取数据使用了ajax，这样会让用户感觉上速度很快。prototype 1.5使用让我节约了不少时间，而且在学习中时刻震惊js的强大。

 

var  quest = location.search.replace( / ?/ g, "" ) // 从获得的url中度群参数部分，可在split来获取每一个 function  getXML()         ... {        $('oTable').style.visibility = "hidden";         var url = 'asp/resaultin.asp';        var pars = quest;        var myAjax = new Ajax.Updater(        'myxml',        url,        ...{        method: 'get',        parameters: pars,        onComplete:onready        });        }

js的事件和windows里很像，所以发现以前学习的东西还是很有用的。prototype直接一句话

Event.observe(document,  ' datasetchanged ' , showMessage,  false ); function  showMessage()  ... {    $('oTable').style.visibility = "visible"; }  

最后用了别人的tab 控件，日期控件，和lightbox--thicjbox--最后换成greybox 效果虽然还觉得有点差异，不过已经很满意了。