Shulou(Shulou.com)06/01 Report--

This article shares with you the content of the sample analysis of Ajax in JavaScript. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

Ajax1. Create steps:

1. Create an XMLHttpRequest asynchronous object

two。 Set request method and request address

3. Next, send the request with send

4. Monitoring status change

5. Finally, receive the returned data

Example:

Const xhr = new XMLHttpRequest () xhr.open ('GET','. / data/test.json' True) xhr.onreadystatechange = function () {if (xhr.readyState = 4) {if (xhr.status = 200) {console.log (JSON.parse (xhr.responseText))} else {console.log ('other cases...')}} xhr.send () 2.ajax Application in jQuery $.ajax ({type: "post") / / request method url: "a.php", / / the link address of the server dataType: "json", / / the format of sending and receiving data data: {username: "james", password: "123456"} Success:function (data) {/ / the function console.log (data) that is called when data is accepted successfully / / data is the data returned by the server}, alert called when error:function (request) {/ / fails to request data ("error occurs:" + request.status);}}); 3.GET method

structure

$.get (url, [data], [callback], [type])

Parameter explanation:

/ / step 1: create asynchronous object var ajax = new XMLHttpRequest (); / / step 2: set the url parameter of the request. Parameter 1 is the type of the request, and parameter 2 is the request urlajax.open ("get", "users.json"); / / step 3: send the request ajax.send () / / step 4: register the event onreadystatechange status change and call ajax.onreadystatechange = function () {if (ajax.readyState = = 4 & & ajax.status = = 200) {/ / step 5: if this judgment can be reached, the data is perfectly back, and the requested page is console.log (ajax.responseText); / / enter the content of the response}}; 4.POST method

It has the same structure and use as the $.get () method, but there is still a difference

The difference between 5.get and post

The security of 1.post is higher than that of get;. If the request is made by get, the request parameters will be spliced to the back of url. If the request is made in post, the request parameters will be wrapped in the request body, resulting in higher security.

two。 Quantity difference: the amount of data transmitted by get is small, and it is stipulated that the amount of data requested can not exceed 2kb. There is no limit.

3. Transmission speed: the transmission speed of get is higher than post.

Because the method is the same, you can switch the program between the GET request and the POST request by changing the jQuery function

Thank you for reading! This is the end of this article on "sample Analysis of Ajax in JavaScript". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.