忍受AJAX

         AJAX 越来越火,连我这个技术如此落后的人都忍不住想试一把,的确,它有着许多诱人的能力,异步,不刷新页面,这正是我们想要的,多年来看着IE 下的蓝条缓慢的前进已经成了我们生活的一部分,终于有机会可以告别慢长的等待,AJAX让我跃跃欲试。

          Ajax(Asynchronous JavaScript+XML,也就是异步的JavaScript+XML)由Adaptive Path的咨询顾问 Jesse James Garrett首先提出。

          先到IBM开发者社区,看到了众的的AJAX文章,了解了AJAX的四大基础:

           HTML、JavaScript 、DHTML 和 DOM 
          也有人说CSS 也在其中,我确认为有没有CSS没多大关系。
         
          除了HTML 其它几种东西都没接触过,一个一个看吧。
          先来看看JavaScript 脚本语言:
          找了份资料,JavaScript语言参考手册.chm 很不错啊,觉得不太难,
 到写个例子试一下的时候发现,太乱了,这种语言,也许这东西根本称不上语言,写起来没头没尾的,连个标准的入口都没有,数据类型也没有,晕,上网找了一段别人写好的代码:
/* Create a new XMLHttpRequest object to talk to the Web server */
var xmlHttp = false;
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
  xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
  try {
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  } catch (e2) {
    xmlHttp = false;
  }
}
@end @*/

翻了半天的手册也没找到@代表什么东东,郁闷。同时也没找到Msxml2.XMLHTTP 是个什么东东,只好概念性的理解这是判断IE 版本的,于是勉强往下:
<DIV align=center>
<DIV id=sb style="BORDER-RIGHT: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid; BACKGROUND: #DCDCDC; WIDTH: 400px; BORDER-BOTTOM: #cccccc 1px solid; HEIGHT: 14px; TEXT-ALIGN: left">
<DIV id=sbChild1 style="FILTER: Alpha(Opacity=0, FinishOpacity=80, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=0); OVERFLOW: hidden; WIDTH: 100%; POSITION: absolute; HEIGHT: 12px">
<DIV style="BACKGROUND: #000000; WIDTH: 100%" hidden overflow: height:12px;></DIV></DIV>
<DIV style="FONT-SIZE: 10px; WIDTH: 400px; COLOR: white; FONT-FAMILY: arial; POSITION: absolute; HEIGHT: 14px; TEXT-ALIGN: center"></DIV></DIV>
<P></P>
<DIV id=infor style="FONT-SIZE: 11px; WIDTH: 100%; COLOR: #999999; FONT-FAMILY: arial; POSITION: relative; HEIGHT: 14px; TEXT-ALIGN: center"></DIV></DIV>

 立即晕倒,爬起来后花了一上午的时间才明白这是DHTML 的东东,基本弄清了意思是设置几个区域外观。  继续前行。

        准备做一个起动和关闭服务页面,不刷新才是最好的。
        先放了四个按钮:
        <input type="button" value="初始化猫" name="init" οnclick="initModem(1)" />
       <input type="button" value="终止猫 "   name="init" οnclick="initModem(2)" />
       <input type="button" value="起动服务" name="init" οnclick="initModem(3)" />
       <input type="button" value="结束服务" name="init" οnclick="initModem(4)" />  

再写它的处理事件
      function initModem(st){
         var url = "StartServlet?start="+st;
         u=0;
         i=25;

         xmlHttp.open("GET", url, true);
         xmlHttp.onreadystatechange = initChange;
         xmlHttp.send(null);
    }

发送到名为StartServlet的servlet

写回调函数:
         function initChange(){

   
    if(xmlHttp.readyState == 4){
        if (xmlHttp.status == 200){
        str=xmlHttp.responseText;
        
        }
    }

}

发现好难调试啊,没法设断点,只好用 window.alert("---");
来调,郁闷++;

不过我发现了一个好用的JavaScript 编辑器叫1st JavaScript Editor ,可以自动提示,郁闷--;
不记得从哪儿下的了,百度一下有很多地方可以下。

明天继续!

href="//www.ibm.com/common/v14/main.css" type="text/css" rel="stylesheet" /> media="all" href="//www.ibm.com/common/v14/cn/zh/screen.css" type="text/css" rel="stylesheet" /> media="print" href="//www.ibm.com/common/v14/cn/zh/print.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="//www.ibm.com/common/v14/cn/zh/detection.js" language="JavaScript"></script> media="screen" href="//www.ibm.com/common/v14/cn/zh/ie2_screen.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="/developerworks/js/dropdown.js" language="JavaScript"></script> <script type="text/javascript" src="/developerworks/email/grabtitle.js" language="JavaScript"></script> <script type="text/javascript" src="/developerworks/email/emailfriend2.js" language="JavaScript"></script> <script type="text/javascript" src="/developerworks/js/ajax1.js" language="javascript"></script> <script type="text/javascript" src="/developerworks/js/searchcount.js" language="javascript"></script> <script type="text/javascript" language="JavaScript">var emailAbstract = "Ajax 由 HTML、JavaScript、DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。本系列的作者是一位 Ajax 专家,他演示了这些技术如何协同工作 —— 从总体概述到细节的讨论 —— 使高效的 Web 开发成为现实。他还揭开了 Ajax 核心概念的神秘面纱,包括 XMLHttpRequest 对象。"; </script> href="//www.ibm.com/common/v14/main.css" type="text/css" rel="stylesheet" /> media="all" href="//www.ibm.com/common/v14/cn/zh/screen.css" type="text/css" rel="stylesheet" /> media="print" href="//www.ibm.com/common/v14/cn/zh/print.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="//www.ibm.com/common/v14/cn/zh/detection.js" language="JavaScript"></script> media="screen" href="//www.ibm.com/common/v14/cn/zh/ie2_screen.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="/developerworks/js/dropdown.js" language="JavaScript"></script> <script type="text/javascript" src="/developerworks/email/grabtitle.js" language="JavaScript"></script> <script type="text/javascript" src="/developerworks/email/emailfriend2.js" language="JavaScript"></script> <script type="text/javascript" src="/developerworks/js/ajax1.js" language="javascript"></script> <script type="text/javascript" src="/developerworks/js/searchcount.js" language="javascript"></script> <script type="text/javascript" language="JavaScript">var emailAbstract = "Ajax 由 HTML、JavaScript、DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。本系列的作者是一位 Ajax 专家,他演示了这些技术如何协同工作 —— 从总体概述到细节的讨论 —— 使高效的 Web 开发成为现实。他还揭开了 Ajax 核心概念的神秘面纱,包括 XMLHttpRequest 对象。"; </script>
已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页