What is Ajax? working principle? How to complete GET request with Ajax

慕斯
Release: 2023-03-10 14:20:01
Original
1931 people have browsed it

The previous article introduced to you "How to use PHP to implement the user avatar upload function? (Detailed introduction)", this article continues to introduce to you what is Ajax? working principle? How to use Ajax to complete a GET request (with code) has certain reference value. Friends in need can refer to it. I hope it will be helpful to everyone.

What is Ajax? working principle? How to complete GET request with Ajax

What is Ajax?

The slang Ajax is used to describe a set of technologies that enable browsers to provide users with a more natural browsing experience. Before Ajax, Web sites forced users into a submit/wait/redisplay paradigm, where the user's actions were always synchronized with the server's "think time." Ajax provides the ability to communicate asynchronously with the server, freeing users from the request/response cycle. With Ajax, you can use JavaScript and DHTML to instantly update the UI when the user clicks a button and make an asynchronous request to the server to perform the update or query the database. When the request comes back, you can use JavaScript and CSS to update the UI accordingly instead of refreshing the entire page. Best of all, the user doesn't even know that the browser is communicating with the server: the website appears to be instantly responsive.

Ajax includes:

* Representation based on XHTML and CSS standards;
* Use Document Object Model for dynamic display and interaction;
* Use XMLHttpRequest Communicates asynchronously with the server;
* Bind everything using JavaScript.

How Ajax works:
The core of Ajax is the JavaScript object XmlHttpRequest. This object was first introduced in Internet Explorer 5 and is a technology that supports asynchronous requests. In short, XmlHttpRequest allows you to use JavaScript to make requests to the server and handle the responses without blocking the user.

How do we use Ajax to complete the GET request:

First, we need to create the Ajax object, and then, we need to create a callback for the request event. This part mainly completes two The first part is to obtain the response data from the server. The second part is to perform DOM operations on the current page, and these DOM operations are nothing more than some addition, deletion, modification and query operations in HTML. The third part is to call Ajax. The open method creates a URL request, and finally the user's URL request is sent to the client. The URL address that completes the get request has two formats: first: the current requested script has no parameters, for example, cheat.php, so This script does not require query parameters; the second one requires parameters. Just insert a question mark in the current script and enter the string; in fact, in actual development, we use JSON format data, but we obtain the data In essence, it is still a string, to be precise, it is a string in JSON format.

We first create an HTML file. Let's take a user's login form as an example: name it login, and we submit it using the get method. , we create two fields in the form, one is: account number; the second is: password, and then we add a submit button,

<!DOCTYPE html>
<htmL>
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
</head>
<body>
       <div align=" cent&#39;>
<h3>用户登录</h3>
<form action="check.php" method="get">
<p>帐号: <input type="text" name="name" id="name"></p>
<p>密码: <input type=" password" name=" password" id=" password"></p>
<p><input type=" submit" id=" submit" value=" 提交"></p>
</form>
</div>
</body>
</html>
Copy after login

The code result is as follows;

What is Ajax? working principle? How to complete GET request with Ajax

Let’s write a script next. First, we get the submit button, and then we add a submit event. The code is as follows:

<script>
Var submit = document . getElementByIdC&#39; submit&#39;); //获取提交按钮
submit. onclick = function  {
}
</script>
Copy after login

Then, we create a PHP file (check.php) In this file we accept the data transmitted from the form, and we submit it in get mode. The submitted target script is (check.php)

The code is as follows:

<?php
echo &#39;<pre class="brush:php;toolbar:false">&#39;;
print_r($_GET);
Copy after login

What is Ajax? working principle? How to complete GET request with Ajax

What is Ajax? working principle? How to complete GET request with Ajax

Recommended learning: "PHP Video Tutorial"

The above is the detailed content of What is Ajax? working principle? How to complete GET request with Ajax. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template