ajax续-白红宇

我们可以修改请求的那些内容

MAIN.JS  request.open('post','/xxx')  //第一部分设置  request.setRequestHeader('wodefa','919')  // 第二部分设置  request.setRequestHeader('Content-Type','x-www-form-urlencoden')  // 第三部分是个空格不用设置			  request.send('ooooooo')	  //第四部分复制代码

下面这张图可以验证设置成功的信息

也可以获取响应的四部分

console.log(request.getAllResponseHeaders()) //响应的请求头复制代码

对应

console.log(request.getAllResponseHeaders()) //获取所有的	console.log(request.status)  //获取响应状态码	console.log(request.statusText)		//获取那个oK	console.log(request.getResponseHeader('Content-Type'))  // 获取 第二部分	console.log(request.responseText)  //获取第四部分复制代码

封装jQuery.ajax

main.jswindow.jQuery=function(){ }  //造一个Jquery 函数  然后下面添加 ajax属性window.jQuery.ajax =function(url,method,body,successFn,failFn){	let request= new XMLHttpRequest()	request.open(method,url)  	request.onreadystatechange = ()=>{		if (request.readyState===4) {			if(request.status>=200 && request.status<=300){				successFn.call(undefined, request.responseText)			}else if(request.status>=400){				failFn.call(undefined,request)			}		}	}	request.send(body)	  //第四部分}	window.$=window.jQuerymyButton.addEventListener('click',(e) => {	window.jQuery.ajax('/xxx','post','a=1&&b=2',(responseText)=>{console.log(1)},(request)=>{console.log(2)})})复制代码

这算升级了？

window.jQuery=function(){ }  //造一个Jquery 函数  然后下面添加 ajax属性window.jQuery.ajax =function(options){	let url=options.url	let method=options.method	let body=options.body	let successFn=options.successFn	let failFn=options.failFn		let request= new XMLHttpRequest()	request.open(method,url)  	request.onreadystatechange = ()=>{		if (request.readyState===4) {			if(request.status>=200 && request.status<=300){				successFn.call(undefined, request.responseText)			}else if(request.status>=400){				failFn.call(undefined,request)			}		}	}	request.send(body)	  //第四部分}	window.$=window.jQuerymyButton.addEventListener('click',(e) => {	let obj={		url: '/xxx',		method: 'post',		body: ' a=1&&b==1',		successFn: ()=>{},		failFn:()=>{}	}	window.jQuery.ajax(obj)})复制代码

在升级？

window.jQuery=function(){ }  //造一个Jquery 函数  然后下面添加 ajax属性window.jQuery.ajax =function(options){	let url=options.url	let method=options.method	let body=options.body	let successFn=options.successFn	let failFn=options.failFn	let headers=options.headers		let request= new XMLHttpRequest()	request.open(method,url)  	for (let key in headers) {		let value = headers[key]		request.setRequestHeader(key,value)	}	request.onreadystatechange = ()=>{		if (request.readyState===4) {			if(request.status>=200 && request.status<=300){				successFn.call(undefined, request.responseText)			}else if(request.status>=400){				failFn.call(undefined,request)			}		}	}	request.send(body)	  //第四部分}function f1(responseText){}function f2(responseText){}myButton.addEventListener('click',(e) => {		window.jQuery.ajax({		url: '/xxx',		method: 'post',		headers:{			'Content-Type': 'text/javascript;charset=utf-8',				'jack':'99'		},		body: ' a=1&&b==1',		successFn: (x)=>{			//加入要传连个函数			f1.call(undefined,x)			f2.call(undefined,x)		},		failFn:(x)=>{			console.log(2)		}	})})复制代码

解构

window.jQuery=function(){ }  //造一个Jquery 函数  然后下面添加 ajax属性window.jQuery.ajax =function({url,method, body, successFn,failFn,headers}){  //  直接从第一个参数解构 同时 直接声明（let）//	let url	// 如何接收两种参数//	if(arguments.length===1){//		url=options.url	//	}else if(arguments.length===2){//		url=arguments[0]//		options=arguments[1]//	}		//	let method=options.method//	let body=options.body//	let successFn=options.successFn//	let failFn=options.failFn//	let headers=options.headers	//ES6//	let {url,method, body, successFn,failFn,headers}=options		let request= new XMLHttpRequest()	request.open(method,url)  	for (let key in headers) {		let value = headers[key]		request.setRequestHeader(key,value)	}	request.onreadystatechange = ()=>{		if (request.readyState===4) {			if(request.status>=200 && request.status<=300){				successFn.call(undefined, request.responseText)			}else if(request.status>=400){				failFn.call(undefined,request)			}		}	}	request.send(body)	  //第四部分}function f1(responseText){}function f2(responseText){}myButton.addEventListener('click',(e) => {		window.jQuery.ajax({		url: '/xxx',		method: 'post',		headers:{			'Content-Type': 'text/javascript;charset=utf-8',				'jack':'99'		},		body: ' a=1&&b==1',		successFn: (x)=>{			//加入要传连个函数			f1.call(undefined,x)			f2.call(undefined,x)		},		failFn:(x)=>{			console.log(2)		}	})})复制代码