	1.Ajax(Asynchronous Javascript And XML)异步的JavaScript和XML。即使用JavaScript语言与服务器进行异步交互，传输的数据为XML
	2.XML是被设计用来传输和存储数据的，可扩展标记语言，是一种标记语言，是从标准通用标记语言中简化修改出来的，他主要用到可扩展标记语言，可扩展样式语言
	3.JSON格式与2001年由Douglas Crockford提出，目的为了取代繁琐笨重的XML格式
	4.优点
	Ajax使用JavaScript技术向服务端发送异步请求
	Ajax请求无需刷新整个页面
	因为服务器响应内容不再是整个页面而是页面中的部分内容，所以Ajax性能高
	两个关键点:局部刷新、异步请求
	5.我们现在使用的是jQuery封装之后的版本

	1.jQuery实现的AJAX
	$.ajax({
	url:'', 控制数据的提交地址
	type:'', 控制请求方式(默认是get请求)
	data:{}, 组织提交的数据
	success:function(形参){
	异步回调函数
	}
	})
	2.JS实现AJAX
	var b2 = document.getElementById("b2");
	b2.onclick = function () {
	// 原生JS
	var xmlHttp = new XMLHttpRequest();
	xmlHttp.open("POST", "/ajax_test/", true);
	xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xmlHttp.send("username=q1mi&password=123456");
	xmlHttp.onreadystatechange = function () {
	if (xmlHttp.readyState === 4 && xmlHttp.status === 200) {
	alert(xmlHttp.responseText);
	}
	};
	};

	1.可以朝后端发送post请求的方式
	1.form表单
	2.Ajax请求

	2.前后端传输数据的编码格式
	1.urlencoded
	2.formdata
	3.json

	3.form表单
	默认的数据编码格式是urlencoded
	数据格式：username=haha&password=123
	格式一:urlencoded
	django 后端针对符合urlencoded编码格式的数据都会帮你解析封装到request.POST中
	username=haha&password=123---->request.POST
	格式二:formdata
	如果把编码格式改成formdata，那么针对普通键值对还是解析到 request.POST中而将文件解析到request.FILES中
	格式三:json
	form表单没法发送json格式数据

	4.Ajax请求
	Content-Type
	格式一: urlencoded
	数据格式: name=joseph&age=21&hobby=read
	django后端同意处理到request.POST中

	格式二:formdata
	数据格式:无法查阅
	django后端自动将文件数据处理到request.FILES 普通数据 request.POST

	格式三:application/json
	数据格式:json格式
	django后端不会自动处理,在request.body中存储(bytes类型)需要自己编写处理
	语法注意事项
	data:JSON.stringify({'name':'joseph','age':21,'hobby'}),
	contentTYPE:'application/json',

	1.前端查看数据类型
	console.log(typeof 字段名)
	console.log(打印)
	console.log(args.name)
	2.diamante编写
	$('#d3').click(function() {
	let formData = new FormData(); # 产生内置对象
	formData.append('username',$('#d1').val()) # 添加普通数据
	formData.append('file', $('#d2')[0].files) # 添加文件数据
	dataType:'JSON' # 直接修改参数
	$.ajax({ # 发送jjax请求
	url:'',
	type:'post',
	data:formData,
	contentType:false, # 不适用任何编码，必须是小写false
	processData:false, # 不处理数据对象,必须是小写false
	success:function (args) {
	alert(args)
	window.location.href = args # 直接返回网页
	console.log(typeof 字段名)
	console.log(打印)
	console.log(args.name)
	}
	})
	})

	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
	# 使用ajax必须导入文件

	<body>
	<input type="text" id="i1"> + <input type="text" id="i2"> = <input type="text" id="i3">
	<button id="d1">计算</button>
	<script>
	// 1.查找计算器按钮标签
	let $btnEle = $('#d1'); // 根据id查找标签对象
	// 2.给按钮标签绑定一个点击事件
	$btnEle.on('click', function () {
	// 3.获取两个输入框内的数据
	// 3.1 先查找到输入框之后获取里面的value属性值即可
	let i1Val = $('#i1').val(); // val()拿到输入框里面的值
	let i2Val = $('#i2').val();
	// 4.发送ajax的请求
	$.ajax({
	uri: '', // 向哪个后端发送请求（路径有3方式：不写，后缀，全路径）
	type: 'post', // 规定发送什么请求方式(get post)
	data: {'i1': i1Val,'i2':i2Val}, // 请求携带的数据
	success:function (args) { // 异步回调机制（后端返回数据之后，自动触发的操作）
	// 形参args就是后端返回过来的数据
	$('#i3').val(args)
	}
	})
	})
	</script>
	</body>

	# 后端
	from django.shortcuts import render,HttpResponse
	import json
	def ajax(request):
	if request.method == 'POST':
	print(request.POST)
	i1 = request.POST.get('i1')
	i2 = request.POST.get('i2')
	res = int(i1) + int(i2)
	return HttpResponse(res)
	return render(request,'ajax.html')

	1.
	后端跟Ajax交互不应该再返回页面，通常情况下都是返回json格式数据
	前端针对HttpResponse和JsonRepose返回的Json格式数据处理策略不同
	HttpResponse返回的是一个字符串
	JsonRepose返回的则是一个JSON格式数据
	HttpResponse不会自动反序列化，而JsonRepose会自动反序列化，如果想让HttpResponse也自动反序列化那么需要添加一个固定参数
	dataType：'JSON'

	1.序列化
	python中序列化与反序列化
	import json
	json.dumps()
	json.loads()
	Js中反序列化
	JSON.stringify()
	JSON.parse()

	2.序列化
	def ser(request):
	# 拿到用户表里面的所有用户对象
	user_list=models.User.objects.all()
	# 导入内置序列化模块，就不需要像之前一样每一个数据都需要自己手动转
	from django.core import serializers
	# 调用该模块下方法，第一个参数是你相依什么样的方式序列化你的数据
	ret=serializers.serialize('json',user_list)
	return HttpResponse(res)

joseph-bright

Ajax基本操作