Quick learning of AJAX

Source: Internet
Author: User

Hello everyone, this is a basic Ajax tutorial. First of all, I am engaged in ASP. NET development.

However, I will explain that AJAX is not the operation of any controls in ASP. NET. Although the Ajax control provided by ASP. net brings great convenience to our use of Ajax

However, I decided to update the "original ecology Ajax"

Well, I don't know how much this tutorial will talk about, but one thing I know is that I will tell you all about Ajax in a simple and popular way.

What Is Ajax? To put it simply, Asynchronous JavaScript + XML

You can go to Google to search for the origins of Ajax. Here are some simple examples. Weak, I remember a Greek hero named "ajax". Haha ......

In fact, the simple understanding of AJAX is a kind of "refreshing new technologies". Of course, this is a general talk. After all

Ajax technology is not that simple.

We are familiar with a lot of Ajax technologies, that is, the online map service. Google maps is the first technology to apply Ajax technology to practical technologies.

Four important technical points used in Ajax technology: javascrip CSS dom (Document Object Model) XMLHTTPRequest object, which will be gradually introduced later.

After learning about the first three technologies, you can learn about Ajax applications.

Let's get started with Ajax.

First, we need to create the XMLHTTPRequest object. Of course, for some reasons, the browser compatibility issues may vary with the creation method.

First, create an XMLHTTPRequest object that supports multiple browsers.

     <  Script  Type  = "Text/JavaScript"> VaR XMLHTTP = False ; // It doesn't matter what it means  Try {XMLHTTP = New Activexobject ( "Msxml2.xmlhttp" );} Catch (E1 ){Try {XMLHTTP = New Activexobject ( "Microsoft. XMLHTTP" );} Catch (E2) {XMLHTTP = False ;}} If (! XMLHTTP && Typeof XMLHttpRequest! = 'Undefined' ) {XMLHTTP = New XMLHttpRequest ();} </  Script  > 

 

Then we can write this into a function.

Next, let's continue writing our first example. Ajax. How are you doing?

To do this, we need to create a general processProgram

Then we will write the following simple in the general processing program:Code

 

 
Public voidProcessrequest (HttpcontextContext) {context. response. contenttype ="Text/html"; Context. response. Write (Datetime. Now. tostring ());}

Now let's start our main task.

 <  Head > <  Title  > </  Title  > <  Script  Type  = "Text/JavaScript"> VaR XMLHTTP = False ; // It doesn't matter what it means  Try {XMLHTTP = New Activexobject ( "Msxml2.xmlhttp" );} Catch (E1 ){Try {XMLHTTP = New Activexobject ( "Microsoft. XMLHTTP" );} Catch (E2) {XMLHTTP = False ;}} If (! XMLHTTP && Typeof XMLHttpRequest! = 'Undefined' ) {XMLHTTP = New XMLHttpRequest ();} Function Getajax () {XMLHTTP. Open ( "Get" , "Ajax. ashx" ); XMLHTTP. onreadystatechange = Function (){ If (XMLHTTP. readystate = 4   & XMLHTTP. Status = 200) {alert (XMLHTTP. responsetext) ;}} XMLHTTP. Send ();} </  Script  > </  Head  > <  Body  > <  Input Type  = "Button"  Value  = "Click my display time"  Onclick  = "Getajax ();"/> </  Body  > </  Html  > 

The above code is a simple example.

I will give you a brief description.

XMLHTTP. Open ("Get","Ajax. ashx"); The first key points in this sentence are "get", which is a way to get data. Of course, there are also common "Post"

In fact, there are several other methods. I remember there are seven methods (Head, put, delete, option, trace). You can search for information by yourself. I will not elaborate on them.

The following is the Request Path. Of course, you can request a URL address.

In fact, there is a third parameter later, which is to set the asynchronous operation or synchronous operation. We will talk about it later.

Onreadystatechange:

When a request is sent to the server, we need to execute some response-based tasks.

To put it simply

When the readystate changes, the onreadystatechange event is triggered.

Onreadystatechange is just an attribute name, not a function name. Here an anonymous function is created.

Readystate:

Indicates the current object status (which has five values]

0: uninitialized, [request not initialized]

1: Loading, [server connection established]

2: loaded, [received request]

3: Interactive, [Processing request]

4: complete. [Request completed and response ready]

Status:

The HTTP response status code can be found on Google.

Let me give you a few simple examples.

403 forbidden,

404 not found, [You know]

200 Normal Return

Therefore, we need to meet these two conditions.

 

All right, leave the rest to us.

Read XMLHTTP. responsetext.

 

Oh, this is the first lesson. It is not easy to explain. I hope you can continue writing this article. Thank you!

 

By the way, you can try embedding a video on the page and then call alert () to see if the video will be interrupted? (* ^__ ^ *) Xi ...... The legend of fresh

Related Article

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.