JS学习(3)---Ajax

5.Ajax

• 使用Ajax
  
  1.创建Ajax对象
  var xhr = new XMLHttpRequest();
  
  2.监听请求

xhr.onreadystatechange = function(){
	//xhr对象的readystate发生改变就会触发该函数
	//xhr对象有五种状态:
	//0: xhr对象已经创建,还没有初始化
	//1: xhr对象调用了open()
	//2: xhr发送了Ajax请求
	//3: 返回了部分数据
	//4: 返回所有数据
	
	if(readystate != 4)
		return;
	if(xhr.status >= 200 && xhr.status <= 300){
		document.querySelector('h1').innerHTML = xhr.responseText;
	}else{
		console.error('请求失败');
	}
}

3.打开对象
xhr.open('get','./text.txt',true);

4.发送请求
xhr.send();

• XMLHttpRequest对象方法

  方法	描述
  new XMLHttpRequest()	创建新的 XMLHttpRequest 对象
  abort()	取消当前请求
  getAllResponseHeaders()	返回头部信息
  getResponseHeader()	返回特定的头部信息
  open(method, url, async, user, psw)	method：请求类型 GET 或 POST url：文件位置 async：true（异步）或 false（同步） user：可选的用户名称 psw：可选的密码
  send()	将请求发送到服务器，用于 GET 请求
  send(string)	将请求发送到服务器，用于 POST 请求
  setRequestHeader()	向要发送的报头添加标签/值对

• XMLHttpRequest 对象属性

  属性	描述
  onreadystatechange	定义当 readyState 属性发生变化时被调用的函数
  readyState	XMLHttpRequest 的状态
  responseText	以字符串返回响应数据
  responseXML	以 XML 数据返回响应数据
  status	返回请求的状态号
  statusText	返回状态文本（比如 "OK" 或 "Not Found"