What is the function of ajax? Detailed explanation of the function and writing method of ajax

This article mainly talks about the definition of ajax, as well as the role of ajax, and finally a detailed explanation of how to write ajax. Now let us look at this article together

What is AjAx?

Asynchronous javascript and xml.

What is the function?

Through AjAx data exchange with the server, AjAx can use web pages to implement layout updates.

This means that parts of a web page can be updated without reloading the entire page.

How to implement Ajax?

XmlHttpRequest object, you can use this object to send a request to the server asynchronously, obtain response updates, and complete partial updates. Open send responseText/responseXML partial response. (If you want to see more, go to the PHP Chinese website AJAX Development Manual column to learn)

Usage Scenario

Log in The page will not jump if failed.

Registration will prompt you in real time whether the username exists.

Linkage between provinces and municipalities.

Manage image server and perform delayed loading.

NativeAjAxWriting:

##

var XHR=null; 
if (window.XMLHttpRequest) { 
    // 非IE内核 
    XHR = new XMLHttpRequest(); 
} else if (window.ActiveXObject) { 
    // IE内核,这里早期IE的版本写法不同,具体可以查询下 
    XHR = new ActiveXObject("Microsoft.XMLHTTP"); 
} else { 
    XHR = null; 
}  
if(XHR){ 
    XHR.open("GET", "ajaxServer.action");  
    XHR.onreadystatechange = function () { 
        // readyState值说明 
        // 0,初始化,XHR对象已经创建,还未执行open 
        // 1,载入,已经调用open方法,但是还没发送请求 
        // 2,载入完成,请求已经发送完成 
        // 3,交互,可以接收到部分数据  
        // status值说明 
        // 200:成功 
        // 404:没有发现文件、查询或URl 
        // 500:服务器产生内部错误 
        if (XHR.readyState == 4 && XHR.status == 200) { 
            // 这里可以对返回的内容做处理 
            // 一般会返回JSON或XML数据格式 
            console.log(XHR.responseText); 
            // 主动释放,JS本身也会回收的 
            XHR = null; 
        } 
    }; 
    XHR.send(); 
}

Jquery AjAxWriting ：

$.ajax({ 
        url:"servlet", 
        type:"post",//get 
        data:{}, 
        async:true, 
        cache:true, 
        complete:function(){}, 
        traditional:false, 
        dataType:"json", 
        success:function(data){}, 
        error:function(){} 
     });  
 $.post("servlet",{},function(data){},"json"); 
 $.get("servlet",function(data){},"json");

This article ends here (if you want to see more, go to the PHP Chinese website

AJAX User Manual column), if you have any questions, you can leave a message below.

The above is the detailed content of What is the function of ajax? Detailed explanation of the function and writing method of ajax. For more information, please follow other related articles on the PHP Chinese website!