ajax代码

最新推荐文章于 2023-11-21 13:31:26 发布

前端菜鸡008

最新推荐文章于 2023-11-21 13:31:26 发布

阅读量138

点赞数

本文链接：https://blog.csdn.net/fghgfhhg/article/details/100941119

版权



<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>ajax新方法</title>
	</head>
	<body>
		<script type="text/javascript">
			var xhr = new XMLHttpRequest();
			var render = new FileReader();

			xhr.onload = function (){
				// 表示成功请求到数据
				// xhr.responseText
			}
			xhr.onerror = function (){
				// 表示未成功获取到数据
				// switch(xhr.status){
				// 	case 405:
				// 		...
				// 		break;
				// 	case 415:
				// 		...
				// 		break;
				// 	default:
				// 		...
				// 		break;
				// }
			}
			
			/*xhr.onprogress = function (e){
				console.log(e.lengthComputable, e.loaded, e.total);
			}*/
			
			xhr.open("GET","https://images.unsplash.com/photo-1568659672931-c98d3639a4b3?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=334&q=80");
			xhr.send(null);
			
			// 函数的形参 必填项在前,非必填项在后(如果有两个以上非必填项)
			// 为了让形参不必按顺序排列,并且可以赋默认值,改成对象
			/*
				obj = {
					url: ,
					success: ,
					fail: ,
					method: ,
					params:
				}
			*/
			function ajax(obj){//这个可以有
				// arguments 参数组成的伪数组,具有数组的属性,但不具有数组的方法 arguments.callee代表函数本身
				var xhr = new XMLHttpRequest();
				
				obj.method = obj.method || "GET";
				obj.params = obj.params || "null";
				obj.success = obj.success || function (res){
					console.log(res);
				}
				obj.fail = obj.fail || function (){
					console.log("fail ...");
				}
				obj.setHeader = obj.setHeader || null;
				
				xhr.onload = function (){//成功取得数据
					var res = JSON.parse(xhr.responseText);
					obj.success(res);
				}
				xhr.onerror = function (){//未成功取得数据
					obj.fail();
				}
				xhr.open(obj.method,obj.url);
				// setHeader 需要在open方法之后,send方法之前设置
				if(obj.setHeader){
					for(var i in obj.setHeader){
						xhr.setRequestHeader(i,obj.setHeader[i]);
					}
				}
				xhr.send(obj.params);
			}
			
		</script>
	</body>
</html>

前端菜鸡008

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax代码

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>ajax新方法</title> </head> <body> <script type="text/javascript"> var xhr =...
复制链接

扫一扫