3-point summary of Ajax technical principles_AJAX related
This article mainly introduces a 3-point summary of the technical principles of Ajax. Friends in need can refer to
ajax: Asynchronous Javascript and XML Asynchronous Javascript and XML.
is a web development technology for creating interactive web applications.
1.0 Advantages:
1.1 Improved user experience through asynchronous mode.
1.2 Optimizes the transmission between the browser and the server, reducing unnecessary data round-trips and bandwidth usage.
1.3 The Ajax engine runs on the client side and takes on part of the grouping that was originally borne by the server, thus reducing the server load under a large number of users.
2.0 Working Principle
The core of Ajax is the Javascript object XmlHttpRequest. This object was first referenced in IE5 and is a technology that supports asynchronous requests. XmlHttpRequest allows you to use Javascript to make requests to the server and process the response, rather than blocking the user, achieving a refresh-free effect.
Due to differences between browsers, there are also differences in the way to create XmlHttpRequest objects (mainly differences between IE and other browsers).
2.1 A more general method of creating asynchronous requests:
function CreateXmlHttp() {
//非IE浏览器创建XmlHttpRequest对象的方法
if (window.XmlHttpRequest) {
xmlhttp = new XmlHttpRequest();
}
//IE浏览器创建XmlHttpRequest对象的方法
if (window.ActiveXObject) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {
try {
xmlhttp = new ActiveXObject("msxml2.XMLHTTP");
}
catch (ex)
{ }
}
}
}2.2 XmlHttpRequest related attributes:
onreadystatechange The event handler for the event triggered each time the state changes.
responseText The string form of the data returned from the server process.
responseXML DOM-compatible document data object returned from the server process.
Status Text The string information accompanying the status code
ReadyState Object status value
0 (not initialization) Object has been established, but it has not been initialized (the open method has not yet been called)
1 (initialization) Object has been established, and the Send method has not yet been called
# 2 (Send data) The send method has been called, but the current status and http header are unknown
3 (Data is being transmitted) Part of the data has been received because the response and http header are incomplete. At this time, it is obtained through responseBody and responseText Some data will have errors,
4 (Complete) The data reception is completed. At this time, the complete response data can be obtained through responseXml and responseText
2.3 Simple Demo example:
function SendAsyncRequest() {
var data = document.getElementById("XXId").value;
CreateXmlHttp(); //创建XmlHttpRequest对象
if (!xmlhttp) { //判断对象是否创建成功
alert("创建xmlhttp对象异常！");
return false;
}
xmlhttp.open("POST", url, false); //开始发送异步请求
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200 ) {
document.getElementById("XXShowId").innerHTML = xmlhttp.ResponseText; //数据接收完毕
}
}
xmlhttp.send();
}3.0 Disadvantages:
1. It destroys the normal behavior of the browser's back button. After dynamically updating the page, it is impossible to return to the state of the previous page.
2. Using Javascript as the basic engine of Ajax, the compatibility of Javascript is not very good. (Of course, the popular JavaScript libraries such as Jquery have greatly improved these problems, and the call to Ajax is also much more convenient. This article only briefly describes the basic implementation principles of Ajax).
The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.
Related articles:
AJAX encapsulated class usage guideAJAX beginner tutorial: First introduction to AJAXDetailed explanation of browser and server interaction in AjaxThe above is the detailed content of 3-point summary of Ajax technical principles_AJAX related. For more information, please follow other related articles on the PHP Chinese website!
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!
Hot Article
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
Hot Topics
Analysis of the function and principle of nohup
Mar 25, 2024 pm 03:24 PM
Analysis of the role and principle of nohup In Unix and Unix-like operating systems, nohup is a commonly used command that is used to run commands in the background. Even if the user exits the current session or closes the terminal window, the command can still continue to be executed. In this article, we will analyze the function and principle of the nohup command in detail. 1. The role of nohup: Running commands in the background: Through the nohup command, we can let long-running commands continue to execute in the background without being affected by the user exiting the terminal session. This needs to be run
How to solve the 403 error encountered by jQuery AJAX request
Feb 20, 2024 am 10:07 AM
Title: Methods and code examples to resolve 403 errors in jQuery AJAX requests. The 403 error refers to a request that the server prohibits access to a resource. This error usually occurs because the request lacks permissions or is rejected by the server. When making jQueryAJAX requests, you sometimes encounter this situation. This article will introduce how to solve this problem and provide code examples. Solution: Check permissions: First ensure that the requested URL address is correct and verify that you have sufficient permissions to access the resource.
Summarize the usage of system() function in Linux system
Feb 23, 2024 pm 06:45 PM
Summary of the system() function under Linux In the Linux system, the system() function is a very commonly used function, which can be used to execute command line commands. This article will introduce the system() function in detail and provide some specific code examples. 1. Basic usage of the system() function. The declaration of the system() function is as follows: intsystem(constchar*command); where the command parameter is a character.
How to solve jQuery AJAX request 403 error
Feb 19, 2024 pm 05:55 PM
jQuery is a popular JavaScript library used to simplify client-side development. AJAX is a technology that sends asynchronous requests and interacts with the server without reloading the entire web page. However, when using jQuery to make AJAX requests, you sometimes encounter 403 errors. 403 errors are usually server-denied access errors, possibly due to security policy or permission issues. In this article, we will discuss how to resolve jQueryAJAX request encountering 403 error
PHP and Ajax: Building an autocomplete suggestion engine
Jun 02, 2024 pm 08:39 PM
Build an autocomplete suggestion engine using PHP and Ajax: Server-side script: handles Ajax requests and returns suggestions (autocomplete.php). Client script: Send Ajax request and display suggestions (autocomplete.js). Practical case: Include script in HTML page and specify search-input element identifier.
How to solve the problem of jQuery AJAX error 403?
Feb 23, 2024 pm 04:27 PM
How to solve the problem of jQueryAJAX error 403? When developing web applications, jQuery is often used to send asynchronous requests. However, sometimes you may encounter error code 403 when using jQueryAJAX, indicating that access is forbidden by the server. This is usually caused by server-side security settings, but there are ways to work around it. This article will introduce how to solve the problem of jQueryAJAX error 403 and provide specific code examples. 1. to make
In-depth discussion of the principles and practices of the Struts framework
Feb 18, 2024 pm 06:10 PM
Principle analysis and practical exploration of the Struts framework. As a commonly used MVC framework in JavaWeb development, the Struts framework has good design patterns and scalability and is widely used in enterprise-level application development. This article will analyze the principles of the Struts framework and explore it with actual code examples to help readers better understand and apply the framework. 1. Analysis of the principles of the Struts framework 1. MVC architecture The Struts framework is based on MVC (Model-View-Con
In-depth understanding of the batch Insert implementation principle in MyBatis
Feb 21, 2024 pm 04:42 PM
MyBatis is a popular Java persistence layer framework that is widely used in various Java projects. Among them, batch insertion is a common operation that can effectively improve the performance of database operations. This article will deeply explore the implementation principle of batch Insert in MyBatis, and analyze it in detail with specific code examples. Batch Insert in MyBatis In MyBatis, batch Insert operations are usually implemented using dynamic SQL. By constructing a line S containing multiple inserted values
