Simple understanding of ajax

Ajax full name: Asynchronous JavaScript and XML that is asynchronous JavaScript and XML. In fact, to put it bluntly, it only loads a certain part of the page without reloading the page. And what I'm mainly talking about here is the de AJAX method in jQuery. Mainly through the two methods of HTTP Get and HTTP Post to request data from the server, so as to achieve what we want.
The load() method in jQuery is a simple and powerful AJAX method. This method loads data from the server and puts the returned data into the element selected by the selector. Its grammatical structure is as follows:
$(selector).load(URL,data,callback);//URL is a required parameter, which is the URL that needs to be loaded,
Both date and callback are optional parameters. The date parameter is used to request a set of strings or key-value pairs; callback is a function that needs to be executed when the load() method is completed.

For example, if you need to load a file in a specified div, it is implemented like this:
$("#div").load("test.text");

$("button").click(function(){//Do the following when the button is clicked
    $("#div1").load("test.txt",function(responseTxt,statusTxt,xhr){//Execute the function after loading test.txt for div1
       if(statusTxt=="success")
         alert('The external content has been loaded successfully');
       if(statusTxt=="error")
         alert("Error:"+xhr.status+":"+xhr.statusText);
  })
})//The final effect is that if the load() method is successful, it will display "the external content has been loaded successfully" and if it fails, an error message will be displayed

$.get(URL,callback);//Request data from the server through HTTP GET, the URL needs to be requested, and it is also a required parameter, and callback is the function executed after the request is completed

$("button").click(function(){//Click the button to perform the operation
  $.get("test.asp",function(data,status){//Execute the function after requesting test.asp successfully
    alert("Data: " + data + "\nStatus: " + status);
  });
});

$.post(URL, data, callback);//Similar to the get method, date is the data sent with the request, URL is required, others are optional

$("button").click(function(){//Click the button to perform the operation
  $.post("demo_test_post.asp",//Request URL demo_test_post.asp script
  {
    name:"Donald Duck",
    city:"Duckburg"
  },//The data sent with the url.
  function(data,status){//The function to execute, date is the content of the requested page, and status is the status.
    alert("Data: " + data + "\nStatus: " + status);
  });
});









Guess you like

Origin http://10.200.1.11:23101/article/api/json?id=326688167&siteId=291194637