Ajax的入门代码

< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >   < title > Ajax入门示例 </ title >   </ head >
< script  type ="text/jscript" >
    
var xmlhttp;
    
function createHTTP()
    
{
        
if(window.ActiveXObject)
        
{
            xmlhttp
=new ActiveXObject("Microsoft.XMLHTTP"); //IE浏览器中创建异步调用对象
        }

        
else if(window.XMLHttpRequest)
        
{
            xmlhttp
=new XMLHttpRequest(); //Firefox中创建异步调用对象
        }

    }

    
function startHTTP()
    
{
        
//第一步:根据不同的浏览器创建异步调用对象(XMLHttpRequest)
        createHTTP();
        
//第二步:加载数据所在的服务器,Ajax可以从其他网站获取数据,也可以从本地的XML文件中获取
                //语法如下:xmlhttp.open(method,url,bool)
                //method:表示HTTP的请求方法,一共有get、post、head、put、delete五种方法;get是将参数追加到URL中发送,而post是将参数串放在请求体中发送。如果数据处理不改变数据的状态(比如获取数据),就用get;如果编辑、更新数据等改变了数据,则用post。
               //URL:表示数据的地址;bool:表示是否使用异步获取,true表示异步,false表示同步
        xmlhttp.open("GET","XMLFile.xml",true);
        
//第三步:异步调用服务器状态的变化:状态变化与事件挂钩,注意方法后面不带括号
        xmlhttp.onreadystatechange=StateDO;   
        
//第四步:发出一个HTTP请求。可以通过在发送请求时设置的参数有选择的挑选数据。如果发送请求时,参数已经放在了请求的URL中,则send方法中,参数可以设置为null或者不写。如果希望把参数放在send方法中,则语法如下:xmlhttp.Send(“id=cgjun”); 由于用Send方法发送参数时,需要考虑很多环境变量,如HTTP Method和服务器的一些设置,所以建议将参数放在请求的URL中
        xmlhttp.send(null);
    }

    
function StateDO()
    
{
        
//判断是否完成状态(异步调用完成时,状态编号为4);返回的状态代码=200,表示调用成功;返回的状态代码=400,表示没有找到
        if(xmlhttp.readystate==4 && xmlhttp.status==200)
        
{
            document.getElementById(
"mytext").innerHTML=xmlhttp.responsetext;
        }

    }

</ script >
< body >
< div  style =""  id ="mytext" > 这是旧数据 </ div >< input  type ="button"  value ="更新DIV"  onclick ="startHTTP()"   /></ body ></ html >

猜你喜欢

转载自blog.csdn.net/qq_41867309/article/details/80568333
今日推荐