传统的表单提交方式
html的form标签具备一个属性action, 可以指定表单的submit事件触发时提交的后台地址。
这种方式发送的请求会使用页面地址发生改变，变成请求的后台地址（页面跳转），这会带来不好的用户体验。
Ajax技术
AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。
AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。
以下是一个使用ajax与后端交互的基本写法。
XMLHttpRequest
XMLHttpRequest 是 AJAX 的基础。
所有现代浏览器均支持 XMLHttpRequest 对象（IE5 和 IE6 使用 ActiveXObject）。
XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
创建 XMLHttpRequest 对象的语法：
var xhr =new XMLHttpRequest();
向服务器发送请求
如需将请求发送到服务器，需要使用 XMLHttpRequest 对象的 open() 和 send() 方法。
监听XMLHttpRequest对象的readyState改变
每当 readyState 改变时，就会触发 onreadystatechange 事件。
readyState 属性存有 XMLHttpRequest 的状态信息。当 readyState 等于 4 且状态为 200 时，表示请求完成且响应已就绪。
服务器响应
此时（当 readyState 等于 4 且状态为 200 时），如需获得来自服务器的响应，就需要使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。
onreadystatechange的位置
其实，只要创建了XMLHttpRequest对象后， 就可以编写onreadystatechange的事件处理函数了，放在send()后send()前或是open()前都是可以的，区别是事件处理函数触发的次数不同，如下
通常我们关心的是xhr.readyState === 4 && xhr.status === 200时的情况（此时后端响应的数据已填充到xhr.responseText中，可以取出来使用了）。
运行结果：
页面地址没有改变，数据已获取到当前页面的控制台（剩下的就是在当前页面某个区域展示数据了）。
