Asynchronous Javascript And XML (Extensible Markup Language), AJAX is not a new language, but utilization of existing holders surgery. The client rendering;
Essence: is asynchronously communicate with a server through the XMLHttpRequest object on the basis of the HTTP protocol.
Action: in the case where a page refresh may not be (partial refresh), the requesting server, updating the local data page;
Asynchronous (Asynchronous): means does not block other certain program execution when program execution, which is a form of program execution sequence of the program itself does not depend on the order written, otherwise, it indicates the synchronization.
Sync: only do one thing at a time, one step before the start of the next
asynchronous: do more things at the same time, higher efficiency.
Send:
the XMLHttpRequest be the handler asynchronously.
1, a user acquires data;
2, so that an asynchronous transmission request objects;
2.1 asynchronous created objects; var xhr = new XMLHttpRequest () ;
2.2 设置 请求行 open(请求方式，请求url):
get请求如果有参数就需要在url后面拼接参数；
post不用写参数，就在请求体中传递；
2.3 设置 请求头 setRequestHeader('key':'value')：
get方式不需要设置请求头；
post需要设置 ("Content-Type","application/x-www-form-urlencoded")；
如果没有设置，参数无法正确的传递到服务器(本质上说，如果没有参数，也不一定需要设置，不会影响请求的发送)；
2.4 设置 请求体:发送请求 send(参数：key=value&key=value)：
如果有参数，post应该在这个位置来传递参数；
xhr.send("username="+name);
对于 get请求不需要在这个位置来传递参数；
xhr.send(null);
Receiving:
a response packet:
packet line: the response status code in response to the status information 200 ok;
packet header: the server returns to some additional client information;
message body: the server returns to the client's data; the responseText: normal string the responseXML: comply xml format string;
一个真正成功的响应应该两个方面：1.服务器成功响应 2.数据已经回到客户端并且可以使用了；
监听异步对象的响应状态：：xhr.onreadystatechange = function(){}
xhr.status:可以获取当前服务器的响应状态 xhr.status== 200（成功）；
解析完毕（判断异步对象的响应状态）：xhr.readystate == 4；
（解析步骤：
0:创建了异步对象，但是还没有真正的去发送请求
1.调用了send方法，正在发送请求
2.send方法执行完毕了，已经收到服务器的响应内容--原始内容，还不可以使用
3.正在解析数据
4.响应内容解析完毕，可以使用了；readystate == 4；）
GET and POST requests difference mode (interview questions)
1, GET request body without using xhr.send (null);
2, by adding the GET request parameters in the request for the URL;
. 3, the POST by xhr.send ( 'name = & itcast Age = 10');
. 4, the POST need provided:
the Content-type: file application / X-WWW-form-urlencoded
. 5, the GET size limit of about 4K, POST is not limited;
JSON (Object):
grammatical rule
1, the data name / value pairs
2, the data separated by a comma (last health / value pair not commas)
3, braces, brackets of the stored backup array
4, use double quotes
[]:数组；{}：对象；
在js中通过JSON.pars()方法将json格式的字符串转换为js数组或者对象( 如果文件以[]来描述数据，那么就转换为数组，如果文件以{}来描述数据，那么就转换为对象)
JSON.stringify():把对象转为字符串；
XML: is a markup language, very similar to HTML, the purpose of which is used to transmit data, with self-descriptive (fixed data format).
Grammar rules:
1, must have a root element;
2, the tag name can not have spaces at the beginning, or not digital, case sensitive;.
3, not cross nesting;
4, double quotes attributes (browser automatically correct double quotes a);
5, to use special symbols entity;
6, and comments as HTML;
sleep (4): Thread pause;
jQUery in Ajax:
$ .ajax ({}) Ajax request can initiate configuration;
$.get() 以GET方式发起Ajax请求：
$.get(url,data,success,datatype):本质上只能发送get请求；
$.post() 以POST方式发起Ajax请求：
$.post(url,data,success,datatype):本质上只能发送post请求；
$('form').serialize()序列化表单（即格式化key=val&key=val）
url 接口地址
type 请求方式
timeout 请求超时；单位为毫秒，如果服务器的响应时间超过指定时间，那么请求失败；
dataType 服务器返回格式 xml，josn，text，html，script，jsonp；
data 发送请求数据
beforeSend:function () {} ：请求发起前调用，如验证；在这个回调函数中，如果return false,那么本次请求会中止；
success（）： 成功响应后调用的函数；
error （）：错误响应时调用的函数；
！！ async: false, 重设为同步执行代码！
complete 响应完成时调用（无论成功和失败都会执行的回调）：
.serialize (): forms can be collected by way of user data sequence:
1. This method is jq way, it is necessary to use the object to call jq;
2. This method can form elements form all the name attribute collection value, generating a key = value & key = value ... this format;
3. ajax, the parameters of the two formats supported (2. 1. Object parameters format string);
Template engine: http://aui.github.io/art-template/zh-cn/
// call the template engine dynamically generated page structure
// If the argument is an object is passed directly to the object
// If the argument is an array, on the packaging object
var html = template ( "musicTemp" , { "items": result});
Origin policy is a security policy browsers, so-called homologous refers to the domain, protocol, port identical.
Cross-domain: different sources; ajax default does not support cross-domain;
JSONP:
dataType: 'jsonp' is provided dataType jsonp i.e. domain access opening;
opening jsonp automatically generates the callback function;
jsonpCallback can specify the appropriate callback function to automatically generate a default;
原理：
1. 主要是利用了script标签的天然的跨域特性来发送请求；
2. 它的实现方式：在发送请求的时候传递一个函数名称给后台，后台返回数据的时候会返回这个函数的调用形式，并且在()中拼接参数；
3. ajax和jsonp的本质不一样。ajax的核心是通过XMLHttpRequest来发送请求，而jsonp是通过script标签来实现请求的发送；
formdat to:
// 1.获取表单
var myform = document.querySelector("#form1");
// 2.将表单做为参数传递，在创建formData对象的时候
var formdata = new FormData(myform);
// 特点之一：可以自由的追加参数
formdata.append("address","传智播客");
// 3.生成的formData对象就可以直接做为异步对象的参数传递
xhr.send(formdata);
$ ( '# Test') [0] .reset (); Reset Form;
Dynamically added Click the button click event registration, event delegates is required;
mysqli_insert_id；
Address access the address bar garbled characters: decodeURI ();