JavaScript and Ajax sections (3)

21st Native (native) Ajax working with Instances

Methods for creating XMLHttpRequest objects

function Createxmlhttprequest () {

if (window. ActiveXObject) {

return new ActiveXObject ("Microsoft.XMLHTTP");

}else if (window. XMLHttpRequest) {

return new XMLHttpRequest ();

}

}

Ajax operations

function Showcontent (titleobj) {

var url= "showcontentservlet?id=" +titleobj.id; Set the submission path

XMLHTTP2 = Createxmlhttprequest (); Creating objects

Xmlhttp2.onreadystatechange = Contentprocessrequest; Setting the callback function

Xmlhttp2.open ("Get", url,true),//get indicates a parameter value in the path, post indicates the value of the Send method

Xmlhttp2.send ("null"); Send Request

}

The callback function is the function that is called after the response is returned

function Contentprocessrequest () {

if (xmlhttp2.readystate = = 4) {

if (Xmlhttp2.status = = 200) {

Manipulating page elements based on Ajax return values

}

}

}

22. XMLHttpRequest Introduction to the object?

1). XMLHttpRequest Common methods,

Open ("Post/get", "Requested Address", "True/false"): The third parameter is whether an asynchronous request is used, can be true, and False

Send (content): Sends a request, the content parameter specifies the requested parameter, or null if it is not required.

setRequestHeader (Header,value): Set the requested header information

2) XMLHttpRequest Common Properties,

A) onreadystatechange specifies the callback function for the XMLHttpRequest object. Equivalent to an event when the state of XMLHttpRequest occurs

The callback function specified by onreadystatechange is called when the change occurs .

Code Case : XMLHttpRequest object. onreadystatechange = function name;

b) Readystate:xmlhttprequest status information, the value is as follows

0: The XMLHttpRequest object has been created, but has not yet been initialized

1: At this point, the code has called the Open () method and XMLHttpRequest is ready to send a request to the server.

2: At this point, a request has been sent to the server through a Send () method, but no response has been received

3: HTTP response header information has been accepted at this time, but the message body part has not been fully received end

4: Response is fully received

c) Status:http status code, only if the value of ReadyState is 3 or 4, the Status property is available, the status value is: 200: Server response is normal, 400: Unable to find the requested resource, 403: No access rights 404: access to the resource does not exist, 500: Server Internal Error

d) ResponseText: Gets the text content of the response (normal text information returned by the server)

f) Responsexml: Gets the content information in the XML format of the response

23. how to handle caching in Ajax

1) Add header ("Cache-control:no-cache, Must-revalidate") on the service side ;

2) add anyajaxobj.setrequestheader ("if-modified-since", "0") to Ajax before sending the request ;

3) add anyajaxobj.setrequestheader ("Cache-control", "No-cache") to Ajax before sending the request ;

4) add "? fresh=" + math.random () after the URL parameter of Ajax; Fresh can take whatever it takes.

5) The fifth method is similar to the fourth, after the URL parameter, add "? timestamp=" + New Date (). GetTime ();

6) replace GET with POST: not recommended

24. Why use Ajax framework?

1). Simplifying the development difficulty of JavaScript

past JavaScript is often used to implement some gadgets,

pop-up warning messages, dynamic text, and more. JavaScript's ability to manipulate the Document Object Model (DOM) and to measure CSS has been overlooked.

2). Resolve Browser compatibility issues

even if it's easy to use JavaScript, but once you encounter a variety of browsers, you will get headaches. Different browsers support JavaScript differently, and different versions of the same browser do not support the same

3). Streamline the development process

Before the development of the client-server asynchronous interaction program must be able to understand the development process is quite cumbersome, you must check the processing state, specify the server handler and set the callback function and other details

25. used in Ajax what are the frameworks?

1). Prototype

is a pure JavaScript function library, which provides good support for Ajax.

2). JQuery

another very good show. The JavaScript library, which provides good support for Ajax, differs from the idea behind the prototype design in that, after using jquery, the developers offer no longer a DOM-to-image but jquery-like.

3). DWR

very professional. The Java AJAX framework, through the DWR framework, can expose methods in Java classes directly to the client

4). Dojo

powerful, contains a lot of content, Ajax is just one of them, characterized by control and control systems

5). Ajaxtags

by a series of JSP tags, which encapsulate common Ajax scenarios as simple tags.

26. What is JQuery

jquery, also known as JavaScript and query, is a library of auxiliary JavaScript development.

JQuery Advantages :

1). Lightweight

2). Powerful Selector

3). Excellent DOM operation package

4). Reliable Event handling mechanism

5). Excellent browser compatibility

6). Perfect AJAX Support

7). Excellent browser compatibility, etc.

8). jquery Concept: Write less, do more

27. Why do you want to use jQuery?

Answer: because jquery is a lightweight framework, less than 30kb in size, it has a powerful selector, an excellent DOM manipulation package, a reliable event handling mechanism (jquery is fairly reliable when dealing with event bindings), and Perfect Ajax (its Ajax package is very good , there is no need to consider the compatibility of complex browsers and problems with the creation and use of XMLHttpRequest objects. ) Excellent browser compatibility. It also supports chained operations, implicit iterations. The separation of the behavioral and structural layers, as well as the rich plug-ins, also enrich the documentation for jquery.

28. How do you use jquery in the company ?

Answer: what is used in the project is to see if you have any project experience (Answer according to your actual situation)

you used the selector Ah, check box ah, form AH, Ajax ah, events, etc.

Configuration Steps for the jquery environment

1) Download the jquery class library and refer to the JQuery class library on the JSP page

<script type= "Text/javascript" src= "Jquery/jquery-1.7.2.min.js"/>

2) Example of jquery invocation:

<script>

Create a page default launch call effect

$ (document). Ready (

function () {

Alert ("Call this method when the page starts!");

}

);

The above code can also be written as follows shorthand method

$ (function () {

Alert ("Call this method when the page starts!");

});

</script>

29. What can jQuery do?

Answer: 1. get the elements of a page

2. modify the appearance of the page

3. change the content of the page large

4. Responding to User's page actions

5. add a dynamic effect to a page

6. no need to refresh the page, that is, you can get information from the server

7. simplifying common javascript tasks

30. $ (document). What is the difference between the ready () method and the window.onload?

answer : two methods have similar functions, but there are differences in the timing of implementation.

1) The Window.onload method is executed when all the elements in the Web page (including all associated files of the element) are fully loaded into the browser.

2) $ (document). The Ready () method manipulates the DOM as it is loaded and invokes the function that performs the binding.

JavaScript and Ajax sections (3)