JavaScript-- gallop script execution's Web page (8)

Twelve, jQuery related

jQuery is an excellent JavaScript library is a compact with grammar and cross-platform compatibility, greatly simplifies JavaScript developers to traverse HTML documents, operating Dom , handle events, perform animations, and develop Ajax operations. jQuery encapsulates a number of predefined functions and objects, and support chained calls (successive calls).

 

Can download jQuery 's js files via script tag src introduced, or by cdn accelerator introducing online ( <script src = "https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"> < / Script> )

jQuery library provides only a call jQuery function ( jQuery is $ equivalent to jQuery ), this function and the function prototype is defined in a number of methods to facilitate the jQuery object and the jQuery function calls.

jQuery function has four parameters:

$ ( "Selector") : jQuery function acquired by the corresponding selector Dom , and then these Dom packaged into a jQuery object and jQuery object returns

$ (Dom Object ) : jQuery function of the Dom packaged as jQuery object and return

$ (HTML text string ) : jQuery function will be created according to incoming text string HTML elements and packaged as jQuery object returns

$ ( Anonymous function ) ( $ (function () {}) ): After the document structure is loaded jQuery function calls anonymous function ( the window.onload = function () {} is an anonymous call to the function when a document is fully loaded)

 

jQuery objects are jQuery a function example, the object can call jQuery methods prototype, which is an array of class objects, are stored in the array Dom object. Dom objects and jQuery objects are two different objects, jQuery objects are jQuery instance of the function, and Dom objects are Node instances, they can call different methods, but they have some relevance, jQuery class object elements of the array of Dom object, jQuery operation object is actually on the jQuery array of class Dom object bulk operations. jQuery objects can Dom objects into each other.

 

For jQuery -related properties and methods can refer to the jQuery official document:

https://api.jquery.com/ (or https://www.jquery123.com/ )

 

Thirteen, Ajax -related

Ajax stands for AsynchronousJavaScript + XML , showing that it is not a new technology, but a combination of multiple technologies. Use Ajax can be more convenient and faster partial page update.

Ajax using XMLHttpRequest objects interact with the server, which can transmit and receive various forms of data format. The so-called asynchronous That is no need to update the entire page and can exchange data with a server, partial page update.

Ajax basic application (not considering IE6 ):

// get XMLHttpRequest Object

var httpRequest = new XMLHttpRequest();

// monitor ready state change

httpRequest.onreadystatechange = function(){...}

// send request

httpRequest.setRequestHeader(‘Content-Type’,’application/x-www-form-urlencoded’);

(或httpRequest.setRequestHeader(‘Content-Type’,’application/json’);

httpRequest.open ( 'Method', 'the URL', to true / false); (set to false can be turned off automatically when the conversion)

httpRequest.send(data);

// process the response information ( the readyState Ready Status Code Description omitted)

httpRequest.onreadystatechange = function(){

if(httpRequest.readyState === XMLHttpRequest.DONE){

... (without exception, successful reception)

}else{

... (not received)

}

}

 

jQuery for Ajax support:

$ .ajax (URL [.settings]) {...} for performing an asynchronous ajax request, Settings is an object, configuration information, the method is also used to configure various body information content:

async // whether asynchronous, the default is true

method // request mode, "GET" / "POST"

// contentType parameter type, default QueryString (query string) // Default application / x-www-form- urlencoded // if the parameter is JSON , should be changed application / json

// the processData data conversion, Boolean values, by default data converted to a query string // If you want to convert JSON , then set it to false

// Data object parameter // if the parameter is json, can be by the JSON.stringify ( Object ) Processing

dataType // data type, which have responseType / json / xml / script ...

beforeSend // callback function, before sending the request to call

complete // callback function, upon receiving a request to call

success // callback request after a successful call

error // callback request error after call

 

Sketches method:

$.get(url[,data][,success][,dataType]){...}

$.post(url[,data][,success][,dataType]){...}

 

Details can refer to the jQuery official document:

https://api.jquery.com/ (or https://www.jquery123.com/ )

 

Guess you like

Origin www.cnblogs.com/wodeqiyuan/p/11496434.html