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

This article mainly introduces "how to use local refresh Ajax technology". In daily operation, I believe many people have doubts about how to use local refresh Ajax technology. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful for you to answer the doubts about "how to use local refresh Ajax technology". Next, please follow the editor to study!

1. The concept of Ajax?

"how did browsers communicate in the past:"

Send request to Jsp page-> servlet to receive-> data to domain object-> forward to jsp page

Synchronous sending request: the characteristic of this request is that every time we forward it, the browser has to re-render the entire page, assuming that my page has 100k of data, and only 1k of data needs to be refreshed. If you use forwarding, then the data of each rendering is 100k, so the rendering pressure of the browser becomes greater.

"Ajax technology to achieve communication:"

Introduction of Ajax: if we use Ajax technology, then we do not need to refresh 99k of our 100k data, but just need to refresh this 1k of data. This is Ajax.

At the beginning, all browsers did not support the so-called local refresh technology, and at first most browsers were not optimistic about this technology. At this time, Microsoft first introduced the concept of asynchronous request in IE browsers, and later saw the excellent performance of Ajax on browsers, so other browser manufacturers also introduced Ajax technology.

Meaning: Ajax is a technology used for local refresh on web pages.

2. Advantages and disadvantages of Ajax technology.

"advantages of Ajax technology:"

Core technology: the core technology of Ajax is XMLHttpRequest, which is an object in JavaScript

It reduces the burden on the server, transfers part of the work previously borne by the server to the client for execution, and uses the idle resources of the client to deal with it.

Update the page with only a local refresh, which increases the response speed of the page and makes the user experience more friendly.

"Ajax technical disadvantages:"

The disadvantage of Ajax is that it is not conducive to SEO promotion and optimization, because search engines cannot directly access the content requested by Ajax.

3. What can Ajax technology do?

"main role:"

Send synchronous or asynchronous requests

Perform a local refresh of the web page

The data in the drop-down list comes from the server's

Do the development of front and back separation

Dynamic authentication of form elements

4. Specific use of Ajax technology.

"steps to use:"

Create a method to get an Ajax object

Function getAjax () {var ajax; try {ajax=new ActiveXObject ("microsoft.xmlhttp");} catch (e) {try {ajax=new XMLHttpRequest ();} catch (e) {alert ('asynchronously didn't change browsers....');}} return ajax;}

Get Ajax object

Var ajax=getAjax ()

Prepare to send Ajax request

Ajax.open ("GET", "${pageContext.request.contextPath} / dates.action")

Send Ajax request

Ajax.send (null)

Monitor 4 states in Ajax

Ajax.onreadystatechange=function () {if (ajax.readyState==4) {/}}

Determine whether the server responded successfully

If (ajax.status==200) {/ / indicates that the server's response is correct var time=ajax.responseText; / / to assign this data directly to a tag document.getElementsByTagName ('span') [0] .innerText = time;}

Get method data transfer (put behind url)

Ajax.open ("GET", "${pageContext.request.contextPath} / dates.action?userName=qianyu&password=123")

Send requests and data in Post mode

/ / set the request header ajax.setRequestHeader ("Content-type", "application/x-www-form-urlencoded"); / / send data ajax.send ("userName=qianyu&password=123"); at this point, the study on "how to use local refresh Ajax technology" is over, hoping to solve everyone's doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

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.