1. AJAX = Asynchronous JavaScript and XML AJAX is not a new programming language, but a new way to use existing standards. 3. The biggest advantage of AJAX is that you can exchange data with the server and update part of the web content without reloading the entire page. 4. AJAX does not require any browser plug-ins, but requires the user to allow JavaScript to execute on the browser.
2, advantages 1. Reduce the burden of the server, on demand data, minimize redundant requests. 2. Partially refresh the page to reduce user psychology and actual waiting time and bring better user experience. 3. Standardized based on XML, and widely supported, no need to install plug-ins, etc., further promote the separation of pages and data.
1. AJAX makes extensive use of javascript and AJAX engines, depending on browser support. Write with browser compatibility in mind. 2. AJAX is only a partial refresh, so the back button on the page is useless. 3. Streaming media and mobile device support is not good, etc.
How AJAX works
1. Create the ajax object (XMLHttpRequest/ActiveXObject (Microsoft. XMLHttp)) 2. Determine the data transfer mode (GET/POST) 3. Open the link open() 4. 5. When the Ajax object completes step 4 (onreadyStatechange) and the data is received, determine the HTTP response status between 200-300 or 304 (cache) and execute the callback functionCopy the code
<! DOCTYPE html> <html> <head> <meta charset="utf-8">
<script>
function loadXMLDoc()
{
var xmlhttp;
if(window.xmlhttprequest) {// IE7+, Firefox, Chrome, Opera, Safari execute code XMLHTTP =new XMLHttpRequest(); }else{// IE6, IE5 execute code XMLHTTP =new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET"."/try/ajax/ajax_info.txt".true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="myDiv"><h2> Use AJAX to modify the text content </h2></div> <buttontype="button" onclick="loadXMLDoc()"</button> </body> </ HTML >Copy the code
function success(text) {
var textarea = document.getElementById('test-response-text');
textarea.value = text;
}
function fail(code) {
var textarea = document.getElementById('test-response-text');
textarea.value = 'Error code: '+ code; } var request = new XMLHttpRequest(); / / new XMLHttpRequest object request. Onreadystatechange =function() {// The function is called back when the state changesif(request. ReadyState === 4) {// Completed successfully // Check the response result:if(request. Status === 200) {responseText:return success(request.responseText);
} else{// Failed, determine the cause of failure according to the response code:returnfail(request.status); }}else{// HTTP requests continue... }} // Send a request: request.open('GET'.'/api/categories');
request.send();
alert('Request sent, please wait for response... ');
Copy the code
Ajax method parameters in jquery. www.cnblogs.com/tylerdonet/…