var xhr = new XMLHttpRequest();
xhr.open('GET', 'example.php');
xhr.send();
xhr.onreadystatechange = function(){
if ( xhr.readyState == 4 && xhr.status == 200 ) {
alert( xhr.responseText );
} else {
alert( xhr.statusText );
}
};
XMLHttpRequest level1的缺点如下
1:对于请求结束的判断有点复杂，或者说没有提供一个请求结束的方法，如果我们使用jquery会发现，jquery的ajax请求会提供三个方法，请求成功、请求失败、请求结束
2:对于文件上传的处理不是很友好，我们做文件上传的时候 需要手动模拟表单提交
3:不支持二进制数据的上传和下载
4:无法知晓在上传和下载过程中的请求进度
5:无法设置请求超时时间
6:无法发送跨域请求
所以XMLHttpRequest2.0的出现就是为以上问题提出解决方案
1:关于请求结束的方法提供
请求成功的回调方法：onload
请求结束的回调方法：onloadend
请求失败的回调方法：onerror//当网络发生错误时会调用该方法，那当onload方法里面出现语法错误时候 会进入该方法吗？
2:关于文件上传
在XMLHttpRequest1.0中我们可以构造一个form表单 然后在构造一个iframe，将form表单放入iframe里面，同时将文件上传控件clone一份到创建的form里面，然后设置表单提交，监听表单onload事件，而在XMLHttpRequest2.0中，我们使用formData属性，formdata模拟一个原始的表单格式的数据，我们可以将input type="file"控件的文件取出，然后利用append方法放入formData里面，同样如果我们希望讲一个form表单放入formdata里面可以在他的初始化将form放进去,var formdata = new formData(form表单对象);
3:二进制的支持
在以前的对于二进制传递的处理中是利用overrideMimeType来强制指定服务器端返回内容的处理格式，我们通过强制指定浏览器以文本形式处理服务器端返回回来的二进制数据，然后获取信息后，将文本再转换为二进制数据，之所以走着一层，是因为浏览器没有向处理图片 视频那种的对于处理二进制的http 规范，那现在我们的新的xmlhttprequest规定可以处理二进制数据了，即通过设置xmlhttprequest的responestype为blob，然后在回调函数中拿到返回对象对的 response属性（注意不是responseText），然后利用blob构造这个response，var blob = new Blob([xhr.response],{type: 'image/png'})
4:关于文件上传下载进度
文件上传：我们使用formdata上传文件后，可以在xmlhttprequest实例的upload属性上的回调方法获取进度
xhr.upload.onloadstart//文件上传开始触发的事件
xhr.upload.onprogress//文件上传过程中触发的事件 返回对象event有两个属性，event.loaded表示已经上传的字节，event.total表示总字节
xhr.upload.onload//文件上传成功触发的事件
xhr.upload.onloadend//文件上传结束触发的事件
xhr.upload.onerror//文件上传出错触发的事件
xhr.upload.ontimeout//文件上传超时触发的事件
文件下载：下载文件时候利用xmlhttprequest实例的onprogress事件获取下载进度，属性同xhr.upload.onprogress，同样下载失败、超时、成功、结束都会触发xhr.onerror、xhr.ontimeout、xhr.onload、xhr.onloadend
5:设置超时时间 通过xmlhttprequest实例的timepout设置超时时间，对应的超时方法xhr.ontimeout
6:关于跨域请求 跨域请求是指向不同域名的服务器发出HTTP请求，以前的浏览器是不支持这种操作的，不过这种情况已经改变了，只要服务器设置了允许跨域请求，前端的请求写法不需要任何改变，只需要浏览器支持跨域操作就好了