Introduction
-
AJAX = Asynchronous JavaScript and XML (asynchronous JavaScript and XML).
-
AJAX is a technology that can update part of a web page without reloading the entire web page.
-
Ajax is not a new programming language, but a technology used to create better, faster, and more interactive Web applications.
-
In 2005, Google made AJAX popular with its Google Suggest. Google Suggest can automatically help you complete the word search.
-
Google Suggest uses AJAX to create a highly dynamic web interface: When you enter keywords in the Google search box, JavaScript will send these characters to the server, and the server will return a list of search suggestions.
-
Just like Bing's search box!
-
For traditional web pages (that is, web pages that do not use ajax technology), if you want to update content or submit a form, you need to reload the entire web page.
-
Web pages using ajax technology can achieve asynchronous partial updates through a small amount of data exchange on the background server.
-
Using Ajax, users can create a direct, highly available, richer, and more dynamic Web user interface close to local desktop applications.
Fake Ajax
We can use a tag on the front end to fake an ajax look. iframe tag
1. Create a new module: sspringmvc-06-ajax, import web support!
2. Write an ajax-frame.html test using iframe and feel the effect
Please enter the address to be loaded:
Load page location:
Using AJAX can do:
When registering, enter the user name to automatically detect whether the user already exists.
When logging in, it prompts that the user name and password are wrong
When deleting a data row, the row ID is sent to the background, and the background is deleted in the database. After the database is successfully deleted, the data row is also deleted in the page DOM.
…and so on
jQuery.ajax
The pure JS native implementation of Ajax will not be explained here, but directly use the one provided by jquery, which is convenient for learning and use, and avoids re-creating the wheel. Interested students can learn about JS native XMLHttpRequest!
The core of Ajax is the MLHttpRequest object (XHR). XHR provides an interface for sending requests to the server and parsing server responses. Ability to obtain new data from the server asynchronously.
jQuery provides a number of methods related to AJAX.
With the jQuery AJAX method, you can use HTTP Get and HTTP Post to request text, HTML, XML or JSON from a remote server-and you can load these external data directly into selected elements of the web page.
jQuery is not a producer, but a porter of nature.
The essence of jQuery Ajax is XMLHttpRequest, which is encapsulated for easy calling!