Home > Web Front-end > JS Tutorial > body text

AJAX framework for learning AJAX from scratch

亚连
Release: 2018-05-25 14:11:01
Original
1575 people have browsed it

This article is the second in a series of tutorials on learning AJAX from scratch. We introduce some different knowledge and learn the ajaxLib and ajaxGold frameworks so that we can better understand ajax.

Above ( Zero-based learning of AJAX (Introduction and Basics of AJAX) provides a detailed introduction and basic application of ajax asynchronous request server. It can be seen that some processes of ajax are relatively unchanged. It is not necessary to write the sending code every time you send a request. Some ajax developers have encapsulated their process into an ajax framework.

This section mainly introduces the two frameworks ajaxLib and ajaxGold.

1.ajaxLib

ajaxLib is a very small ajax framework.
Use it to first introduce file usage into the page. The modified framework is a framework that directly obtains XML. The dispatch function is as follows:

loadXMLDoc(url,callback,boolean)
where url is the address of the asynchronous request, and callback is the function that is dispatched after returning after the request is successful. Name; boolean indicates whether to remove spaces in the XML document, true means removing spaces

For example:

<input type="button" value="display" onclick="loadXMLDoc(&#39;1-7.aspx&#39;,decodeXML,false);" />
Copy after login

The XML document returned by the AjaxLib framework is saved in the global variable resultXML, which can be written in decodeXML The program analyzes it, for example:

function decodeXML(){
var oTemp =resultXML.getElementsByTagName("temp");
document.getElementById("targetID").innerHTML = oTemp[0].firstChild.nodeValue;
}
Copy after login

You can see that the code length is much less than before.

2. Use ajaxGold

Ajaxgold is another particularly practical ajax framework.

Ajaxgold is another particularly practical ajax framework. It has 4 functions for developers to use

getDataReturnText(url,callback);
getDataReturnXML(url,callback);
postDataReturnText(url,data,callback);
postDataReturnXML(url,data,callback);
Copy after login

The first two are used to return text and XML in the get method, and the latter two functions are used to return text and XML using the POST request method. The following is postDataReturnText(url, data, callback) as an example

<form>
    <input type="button" value="请求数据" onclick="postDataReturnText(&#39;1-8.aspx&#39;,&#39;a=2&b=3&#39;,display);">
 </form>
<p id="targetID">提取的数据将要显示在这</p>
Copy after login

The above code sends data to 1-8.aspx and passes the data a=2b=3. After the server returns successfully, the function display() is dispatched to process the return value.

In ajaxGold, the return text is used as the only parameter of the callback function, so the display() function can be written like this

<script type="text/javascript">
            function display(text) {
                document.getElementById("targetID").innerHTML = text;
            }
</script>
Copy after login

The above is what I compiled for everyone, I hope it will be useful to everyone in the future helpful.

Related articles:

Ajax get request cache processing solution

Server-side configuration to implement AJAX cross-domain request

java jquery method of processing xml data

The above is the detailed content of AJAX framework for learning AJAX from scratch. 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