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

This article mainly introduces what AJAX common interview questions are, which can be used for reference by interested friends. I hope you will gain a lot after reading this article. Let's take a look at it.

What is AJAX and why use Ajax

AJAX is the abbreviation of "Asynchronous JavaScript and XML". He is referring to a web development technology that creates interactive web applications. 、

Client and server can communicate asynchronously with the server without having to refresh the entire browser.

What is the difference between AJAX applications and traditional Web applications?

What is the difference between AJAX applications and traditional Web applications?

In the interaction between the traditional web front end and the back end, the browser directly accesses the Servlet of Tomcat to obtain data. Servlet forwards the data to the browser.

When we use AJAX, the browser first sends the request to the XMLHttpRequest asynchronous object, which encapsulates the request, and then sends it to the server. The server does not respond by forwarding, but by streaming the data back to the browser

The XMLHttpRequest asynchronous object will constantly listen for changes in the state of the server, get the data returned by the server, and write it to the browser [because it is not a forwarding method, you can get the data on the server side without refresh]

Write the picture description here.

Please introduce the XMLhttprequest object

Please introduce the XMLhttprequest object

The core of Ajax is the JavaScript object XmlHttpRequest. This object, first introduced in Internet Explorer 5, is a technology that supports asynchronous requests. In short, XmlHttpRequest allows you to use JavaScript to make requests to the server and process responses without blocking users. Through the XMLHttpRequest object, Web developers can update the page partially after the page is loaded

Introduce the common methods and property methods of XMLHttpRequest object

Open () (String method,String url,boolean asynch,String username,String password)

Send (content)

SetRequestHeader (String header,String value)

GetAllResponseHeaders ()

GetResponseHeader (String header)

Abort ()

The common method is the first three in black and bold.

Open (): this method creates a http request

The first parameter is to specify the submission method (post, get)

The second parameter is to specify the address to be submitted

The third parameter specifies whether it is asynchronous or synchronous (true means asynchronous, false means synchronous)

The fourth and fifth parameters are used in http authentication. Is optional.

SetRequestHeader (String header,String value): sets the header (used only in post mode, which is not required for the get method)

Xmlhttp.setRequestHeader ("Content-type", "application/x-www-form-urlencoded")

Send (content): sends a request to the server

If it is in get mode, you do not need to enter parameters or null.

If it is post, write down the parameters to be submitted

Attribute

Onreadystatechange: an event trigger that requests a state change (this method is called when readyState changes), which is generally used to specify a callback function

ReadyState: as soon as the request status readyState changes, the callback function is called. It has five states.

0: not initialized

After the 1:open method is called successfully

2: the server has answered the client's request

3: interacting. The Http header information has been received, and the response data has not been received.

4: complete. Data reception completed

ResponseText: the text content returned by the server

ResponseXML: DOM-compatible XML content returned by the server

Status: the status code returned by the server

StatusText: the text message of the status code returned by the server

The callback function is mentioned in two places above. What is the callback function?

The callback function is to receive the content returned by the server!

Write the picture description here.

What is the implementation process of Ajax?

What is the implementation process of Ajax?

(1) create a XMLHttpRequest object, that is, create an asynchronous invocation object.

(2) create a new HTTP request and specify the method, URL and authentication information of the HTTP request.

(3) set the function that responds to the state change of the HTTP request.

(4) send HTTP request.

(5) get the data returned by the asynchronous call.

(6) use JavaScript and DOM to realize local refresh.

Javascript-K0K

How many kinds of CALLBACK are there in AJAX requests?

How many kinds of CALLBACK are there in AJAX requests?

There are a total of eight Callback types for Ajax requests

OnSuccess

OnFailure

OnUninitialized

OnLoading

OnLoaded

OnInteractive

OnComplete

OnException

Is there any difference in how XMLHttpRequest objects are created in IE and Firefox.

Yes, it is obtained through new ActiveXObject () in IE and newXMLHttpRequest () in Firefox.

Of course, we usually use the ajax method encapsulated by jquery, so it's not so troublesome.

What are the advantages and disadvantages of AJAX?

What are the advantages and disadvantages of AJAX?

Advantages:

1, the biggest point is that the page is not refreshed, the user experience is very good.

2. Communicate with the server asynchronously, which has the ability to respond more quickly.

3. We can transfer the work of some previous servers to the client, make use of the idle ability of the client to deal with it, reduce the burden of the server and bandwidth, and save space and broadband rental costs. And reduce the burden on the server, ajax's principle is to "fetch data on demand", which can minimize the burden of redundant requests and responses on the server.

4. Based on standardized and widely supported technology, there is no need to download plug-ins or Mini Program.

Disadvantages:

1. Ajax does not support browser back button.

2. Security issues AJAX exposes the details of interacting with the server.

3. The support for search engine is weak.

4. Destroy the exception mechanism of the program.

5. It is not easy to debug.

Please explain the homologous policy of JavaScript.

Please explain the homologous policy of JavaScript.

The same origin policy is an important security metric for client script, especially Javascript. It originated from Netscape Navigator2.0 and was designed to prevent a document or script from being loaded from multiple different sources. The so-called cognate means that the protocol, domain name and port are the same, and the cognate policy is a security protocol, which means that a script can only read properties from windows and documents from the same source.

Explain loading JS asynchronously.

Explain loading JS asynchronously.

Asynchronous loading scheme: dynamically inserting script tags

Get the js code through ajax, and then execute it through eval

Add a defer or async attribute to the script tag

Create and insert iframe to execute js asynchronously

Reference:

Https://www.cnblogs.com/zichi/p/4597766.html

Https://www.cnblogs.com/xkloveme/articles/7569426.html

How to solve the cross-domain problem?

How to solve the cross-domain problem?

Understand the concept of cross-domain: only if the protocol, domain name and port are the same, otherwise they are all cross-domain.

For security reasons, the server does not allow ajax to obtain data across domains, but it can obtain file contents across domains.

So based on this, you can dynamically create a script tag, access the js file with the src attribute of the tag, and the content of the js script is a function call, and the parameter of the function call is the data returned by the server. In order to obtain the parameter data here, you need to define a callback function in the page in advance and process the data returned by the server in the callback function. [JSONP]

Configure cross-domain configuration on the backend [CORS]

The front-end ajax requests the local interface. After receiving the request, the local interface requests data from the actual interface, and then returns the information to the front-end [proxy].

For cross-domain problems of AJAX, please refer to the next article.

Does Ajax solve browser caching problems?

Does Ajax solve browser caching problems?

1. Add anyAjaxObj.setRequestHeader ("If-Modified-Since", "0") before ajax sends the request.

2. Add anyAjaxObj.setRequestHeader ("Cache-Control", "no-cache") before ajax sends the request.

3. Add a random number after URL: "fresh=" + Math.random ();.

4. Add a timestamp after URL: "nowtime=" + new Date (). GetTime ();.

5. If you are using jQuery, you can just do this for $.ajaxsetup ({cache:false}). In this way, all ajax of the page will execute this statement, but there is no need to save the cache record.

Thank you for reading this article carefully. I hope the article "what are the test questions you often meet with AJAX" shared by the editor will be helpful to you. At the same time, I also hope that you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

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.