Ajax运行原理

本文介绍了AJAX技术的基本概念及其在客户端的应用方式。通过三个步骤详细解释了如何使用异步JavaScript和XML实现数据的异步加载及处理过程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

      AJAX本身就是客户端的技术,异步的JavaScript 和 XML 技术,所谓异步,就是你做你的,我做我的,我们不需要同步。比如注册的时候,当你在填完用户名,接着填写密码的时候,电脑可以边检查账号是否合法。那么怎么来实现这个技术呢?

其实说起来很简单,也就 3 步吧 : 

第一步:创建浏览器对象

第二步:用此对象的方法提交数据到服务器端处理,等待处理结果  即等待服务器的相应

第三步:等到结果后 ,具体做什么处理

//判断浏览器型号

第一步:创建浏览器对象,代码如下

var xmlHttp;

    function createXmlHttpRequest()

    {

        if(window.XMLHttpRequest)

        {

            xmlHttp=new XMLHttpRequest();

            if(xmlHttp.overrideMimeType)

            {

                 xmlHttp.overrideMimeType("text/xml");

             }

        }

        else if(window.ActiveXObject)

        {

            try

            {

                xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");   

            }

            catch(e)

            {

                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");   

            }

        }

        if(!xmlHttp)

        {

            window.alert("你的浏览器不支持创建XMLhttpRequest对象");

        }

        return xmlHttp;

}

第二步:用第一步创建的对象把数据提交到服务器端进行处理,代码如下

function SendData(number)

{

        createXmlHttpRequest();  // 第一步的创建对象

        var url="DataFile/CheckAdName.aspx?data="+number; // 定义一URL,用于发送数据

        xmlHttp.open("POST",url,true); // 以POST方式提交,当然,还有另外一种GET

        xmlHttp.onreadystatechange=ProcessResult;  // 得到结果后的处理函数

        xmlHttp.send(null);

}

第三步:等得到结果后 ,具体做什么处理,代码如下:

function ProcessResult()

{

    var obj=document.getElementById("showResult");   // 这是显示页面的一个标签

    if(xmlHttp.readyState==4)//服务器响应状态

    {

        if(xmlHttp.status==200)//代码执行状态

        {

              obj.innerHTML="您提交的数据是" + xmlHttp.responseText;

 // xmlHttp.responseText就是我们在服务器端处理后打印的结果,让他显示在标签上

        }   

    }

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值