Backend Development
XML/RSS Tutorial
Detailed explanation of XMLHTTP object encapsulation technology sample code
Detailed explanation of XMLHTTP object encapsulation technology sample code
The implementation of ajax technology mainly relies on xmlhttprequest, but when we call it for asynchronous data transmission, since xmlhttp is a short-term process (it is destroyed after the event processing is completed), if the object is not packaged, it has to be processed in Reconstructing xmlhttprequest where it needs to be called requires writing a large section of code for each call, which is really not a good idea. Fortunately, many open source ajax frameworks now provide solutions for encapsulating xmlhttp. Here we use the prototype-1.4.0.js that comes with ajaxtags as the master to see how to encapsulate the xmlhttp object into a reusable method.
In prototype.js, we first define a variable: Ajax
var Ajax = {
getTransport: function() {
return Try.these(
function() {return new ActiveXObject('Msxml2.XMLHTTP')},
function() {return new ActiveXObject('Microsoft.XMLHTTP')},
function() {return new XMLHttpRequest()}
) || false;
},
activeRequestCount: 0
}The variable returns an xmlhttprequest. You can see that if we call Ajax.getTransport(), it will be returned every time A new xmlhttprequest object.
A basic method Ajax.Base and the prototype of the basic method are defined in the Ajax variable (initially, each script method has an empty prototype by default, which will inherit the prototype of Object. If we If the prototype is changed in Object, all script methods will be changed) This basic method is inherited by Ajax.Request. Note that if the inherited prototype's method or variable with the same name is filled in Ajax.Request, it will be changed. Implement overloading.
The most important thing in the Ajax.Base prototype is the setOptions method, which we will use later.
setOptions: function(options) {
this.options = {
method: 'post',
asynchronous: true,
parameters: ''
}The request in prototype is implemented by defining the Ajax.Request prototype (Ajax.Request.prototype). But we cannot directly call Ajax.Request. The main reason is that Ajax.Request does not provide a unified processing process. And we may need to obtain the response through the request. (Imagine that the customer sent a message but never received a reply. That would be very annoying~) The prototype also encapsulates the response (Ajax.Responders) for us, but both They are independent of each other. How to integrate them?
We are provided with two solutions in the prototype, one is Ajax.Updater and the other is Ajax.PeriodicalUpdater. The two have in common that 3 parameters must be passed in:
container :
The position where the response data is to be conveyed. The position is defined by the id of the html tag. For example, if you want to output the returned data to a
url: The destination to which the
request request is to be passed. The destination should be a servlet or jspservlet, because the request object can only be automatically obtained by the do*** method in the servlet.
options:
The structure should be the same as the option structure in setOptions() defined by Ajax.Base above. If it is empty or not written, the initial value defined by Ajax.Base will be used (none used when passing any parameters).
The difference between the two is that Ajax.Updater returns the complete responseText to the container. Only when the responseText is completely obtained and no exception occurs, the content will be written to the container. When PeriodicalUpdater obtains the responseText, Regardless of whether it has been completely obtained, the content is filled into the container until an exception occurs or the responseText is completely obtained. In most cases, the first method should be used, because the first method will display the exception information in the container when an exception occurs, while the second method may not.
Now that xmlhttp has been encapsulated, we only need to set the three parameters mentioned above. It should be noted that when setting the options parameters, we must set them according to the options structure in the base. If we use the post method, we can also set the postBody attribute in opitons and put the queryString to be transferred in the body. An example of a script using the post method to transfer is as follows:
/*表单提交用post方法*/
function doRequest(container,paraments,url){
var options ={
method: 'post',
asynchronous: true,
postBody: paraments
};
new Ajax.Updater(container,url,options);
}The last thing I have to say is Chinese Encoding issues, the prototype performs encoding conversion on the passed parameters, and each passed value is processed through encodeURIComponent. The encoding will be converted to utf-8. When obtaining the request in the background, you should uniformly use request.setCharacterEncoding("UTF-8") to set the encoding for the request, regardless of the encoding format of the page. If you use the post method to transfer data, it will automatically execute:
request． setHeader('Content-type','application/x-www-form-urlencoded'). Ensure that the encoding format of the transmitted data is correct.
The above is the detailed content of Detailed explanation of XMLHTTP object encapsulation technology sample code. For more information, please follow other related articles on the PHP Chinese website!
Hot AI Tools
Undress AI Tool
Undress images for free
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
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
Can I open an XML file using PowerPoint?
Feb 19, 2024 pm 09:06 PM
Can XML files be opened with PPT? XML, Extensible Markup Language (Extensible Markup Language), is a universal markup language that is widely used in data exchange and data storage. Compared with HTML, XML is more flexible and can define its own tags and data structures, making the storage and exchange of data more convenient and unified. PPT, or PowerPoint, is a software developed by Microsoft for creating presentations. It provides a comprehensive way of
How do you parse and process HTML/XML in PHP?
Feb 07, 2025 am 11:57 AM
This tutorial demonstrates how to efficiently process XML documents using PHP. XML (eXtensible Markup Language) is a versatile text-based markup language designed for both human readability and machine parsing. It's commonly used for data storage an
How to use PHP functions to process XML data?
May 05, 2024 am 09:15 AM
Use PHPXML functions to process XML data: Parse XML data: simplexml_load_file() and simplexml_load_string() load XML files or strings. Access XML data: Use the properties and methods of the SimpleXML object to obtain element names, attribute values, and subelements. Modify XML data: add new elements and attributes using the addChild() and addAttribute() methods. Serialized XML data: The asXML() method converts a SimpleXML object into an XML string. Practical example: parse product feed XML, extract product information, transform and store it into a database.
An in-depth study of the causes and solutions of 404 errors
Feb 25, 2024 pm 12:21 PM
Explore the causes and solutions of HTTP status code 404 Introduction: In the process of browsing the web, we often encounter HTTP status code 404. This status code indicates that the server was unable to find the requested resource. In this article, we will explore the causes of HTTP status code 404 and share some solutions. 1. Reasons for HTTP status code 404: 1.1 Resource does not exist: The most common reason is that the requested resource does not exist on the server. This may be caused by the file being accidentally deleted, incorrectly named, incorrectly pathed, etc.
How to implement HTTP streaming using C++?
May 31, 2024 am 11:06 AM
How to implement HTTP streaming in C++? Create an SSL stream socket using Boost.Asio and the asiohttps client library. Connect to the server and send an HTTP request. Receive HTTP response headers and print them. Receives the HTTP response body and prints it.
C and XML: Exploring the Relationship and Support
Apr 21, 2025 am 12:02 AM
C interacts with XML through third-party libraries (such as TinyXML, Pugixml, Xerces-C). 1) Use the library to parse XML files and convert them into C-processable data structures. 2) When generating XML, convert the C data structure to XML format. 3) In practical applications, XML is often used for configuration files and data exchange to improve development efficiency.
How to implement HTTP file upload security using Golang?
Jun 01, 2024 pm 02:45 PM
Implementing HTTP file upload security in Golang requires following these steps: Verify file type. Limit file size. Detect viruses and malware. Store files securely.
What is HTTP?
Feb 19, 2024 pm 04:15 PM
HTTP refers to Hypertext Transfer Protocol, an application layer protocol used to transmit hypertext data. It is the basis that allows servers and clients of the World Wide Web to communicate. Definition and Development of HTTP The HTTP protocol was created in 1989 by British computer scientist Tim Berners-Lee. At the time, he was working at CERN (the European Center for Nuclear Research), where he proposed a new method for sharing hypertext files between different computers. This is the prototype of HTTP. most
