XMLHttpRequest Usage & #183; & #183; & #183; & #183; & #183; & #183;, xmlhttprequest usage

Source: Internet
Author: User

How to Use XMLHttpRequest...

// JavaScript Document


/* Create an XMLHttpRequest object
* The core of this Code is divided into three steps:
1. Create a variable xmlHttp to reference the XMLHttpRequest object to be created.
2. Try to create this object in Microsoft browser:
1) try to create it using the Msxml2.XMLHTTP object.
2) if it fails, try the Microsoft. XMLHTTP object again.
3. If xmlHttp is still not created, this object is created in non-Microsoft mode.

*/


Function createXmlHttp (){
Var xmlHttp = false;
Try {
// Create an XMLHttpRequest object in the Microsoft browser
// If you use a newer version of Internet Explorer, you need to use the object Msxml2.XMLHTTP
XmlHttp = new ActiveXObject ("Msxml2.XMLHTTP ");
} Catch (e ){
Try {
// Earlier versions of Internet Explorer use Microsoft. XMLHTTP
XmlHttp = new ActiveXObject ("Microsoft. XMLHTTP ");
} Catch (e2 ){
XmlHttp = false;
}
}
// Create an XMLHttpRequest object in a non-Microsoft browser
If (! XmlHttp & typeof XMLHttpRequest! = 'Undefined '){
XmlHttp = new XMLHttpRequest ();
}
Return xmlHttp;
}

/* Send a request:
Basically all Ajax applications share the same process:


1. obtain the required data from the Web form.
2. Create the URL to be connected.
3. Open the connection to the server.
4. Set the function to run after the server completes.
5. Send a request.
*/

Function callServer (){
// Get the city and state from the web form
Var city = document. getElementById ("city"). value;
Var state = document. getElementById ("state"). value;
// Only go on if there are values for both fields
If (city = null) | (city = "") return;
If (state = null) | (state = "") return;
// Build the URL to connect
Var url = "/scripts/getZipCode. php? City = "+ escape (city) +" & state = "+ escape (state );
// Open a connection to the server
XmlHttp. open ("GET", url, true );
// Setup a function for the server to run when it's done
XmlHttp. onreadystatechange = updatePage;
// Send the request
XmlHttp. send (null );
}
/* The onreadystatechange attribute of xmlHttp can tell the server what to do after running.
Because the Code does not wait for the server, you must let the server know how to do so that you can respond.
In this example, if the server finishes processing the request, a special method named updatePage () will be triggered.

Note that this attribute is set in the code -- it is set before sending () is called.
This attribute must be set before a request is sent, so that the server can view this attribute only after the request is answered.
*/

Function updatePage (){
If (request. readyState = 4)
If (request. status = 200)
Alert ("Server is done! ");
Else if (request. status = 404)
Alert ("Request URL does not exist ");
Else
Alert ("Error: status code is" + request. status );
}






























What is XMLHttpRequest?

1. What is an XMLHTTPRequest object?

The most common definition is: XmlHttp is a set of APIs that can be transmitted over http or receive XML and other data in scripting languages such as Javascript, VbScript, and Jscript. XmlHttp can be used to update part of the webpage without refreshing the entire page. (This function is one of the major characteristics of AJAX)

Explanation from MSDN: XmlHttp provides the protocol for communication between the client and the http server. The client can send a request to the http server through the XmlHttp object (MSXML2.XMLHTTP. 3.0) and use the Microsoft XML Document Object Model Microsoft? XML Document Object Model (DOM) processes the response.

Here are some external things. In fact, this thing has appeared very early, but in the past, the support of browsers was not enough, and only IE was supported. Therefore, most WEB programmers did not use it, but now the situation has changed a lot. Mozilla and Safari adopt it as the de facto standard, and mainstream browsers are beginning to support XMLHTTPRequest objects. However, it is important to note that XMLHTTPRequest is not yet a W3C standard, so it is slightly different in different browsers.

2. Create an XMLHTTPRequest object

Speaking of the difference, let's take a look at how to declare (use) it. Before using the XMLHTTPRequest object to send a request and process a response, we must use javascript to create an XMLHTTPRequest object. (IE implements XMLHTTPRequest as an ActiveX object, while other browsers [such as Firefox/Safari/Opear] implement it as a local javascript Object ). Next let's take a look at how to use javascript to create it:

The following is a reference clip:

<Script language = "javascript" type = "text/javascript">

<! --

Var xmlhttp;

// Create an XMLHTTPRequest object

Function createXMLHTTPRequest (){

If (window. ActiveXObject) {// determines whether ActiveX controls are supported

Xmlhttp = new ActiveObject ("Microsoft. XMLHTTP"); // create an XMLHTTPRequest object by instantiating a new instance of ActiveXObject

}

Else if (window. XMLHTTPRequest) {// determines whether to implement XMLHTTPRequest as a local javascript Object

Xmlhttp = new XMLHTTPRequest (); // create an instance of XMLHTTPRequest (local javascript Object)

}

}

// -->

</Script> 3. attributes and Methods

Since there are too many things, I will first use a page to list some methods and attributes. I will give you a detailed example later (I am also learning ).

<Html>

<Head>

<...... Remaining full text>

Xmlhttprequest call Substitution Method

The purpose of introducing inline functions is to solve the problem of function calling efficiency in the program.

A function is a more advanced abstraction. The introduction of this function allows programmers to focus only on functions and usage of functions, rather than the specific implementation of functions. The introduction of functions can reduce the program's target code, sharing Program code and data. However, function calling also reduces the efficiency, because the calling function actually transfers the execution order of the program to an address stored in the function in the memory. After the function program content is executed, return to the place before the function is executed.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.