特點：
? ? ? ? 異步提交
? ? ? ? 局部刷新
例子：github注冊
動態獲取用戶名實時的跟后端確認并實時的展示到前端（局部刷新）?
朝后端發送請求的方式
? ? ? ? 1.瀏覽器地址欄直接輸入url回車 -----》get請求
? ? ? ? 2.a標簽的href屬性 ?-----》get請求
? ? ? ? 3.form表單 -----》get請求、post請求
? ? ? ? 4.ajax -----》 get請求、post請求
真正的ajax原生，需要使用js操作，jq的ajax方法是對原生js的封裝，方便咱們使用
（其他框架也可以，原理是一樣的）
前后端混合項目中，我們通常使用jq的ajax實現 js和后端異步交互
? ? ? ? jq操作dom
? ? ? ? jq發ajax請求
前后端分離項目中，我們會使用另一個第三方庫，實現 js和后端異步交互（axios）
?
寫一個例子：
頁面上有三個input框，前兩個框輸入數字，點擊提交，朝后端發送ajax請求，后端計算出結果再返回給前端，動態展示到第三個input框中，整個頁面不能刷新，也不能在前端計算
html代碼
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<input type="text" id="d1">+<input type="text" id="d2">=<input type="text" id="d3">
<button id="btn">提交</button>
<script>// 先給按鈕一個點擊事件$('#btn').click(function (){// 朝后端發送ajax請求$.ajax({// 1.指定朝哪個后端發送ajax請求url:'', // 不寫就是朝當前地址提交// 2.請求方式type:'post', // 不指定就是get，都是小寫// 3.數據data:{'l1':$('#d1').val(),'l2':$('#d2').val()},// 4.回調函數:當后端給你返回結果的時候會自動觸發 args接收后端返回的結果success:function (args) {$('#d3').val(args)}})})
</script>
</body>
</html>views代碼
from django.shortcuts import render,HttpResponsedef ab_ajax(request):if request.method=='POST':l1 = request.POST.get('l1')l2 = request.POST.get('l2')#先轉成整型再加l3=int(l1)+int(l2)return HttpResponse(l3)return render(request,'ajax.html')前后端傳輸數據的編碼格式（contentType）
因為get請求數據就是直接放在url后面的（url?user=kk$pwd=123），所以主要看下post請求的編碼格式
向后端發送post請求的方式
? ? ? ? 1.form表單
? ? ? ? 2.ajax請求
前后端傳輸數據的編碼格式
? ? ? ? urlencoded
? ? ? ? formdata
? ? ? ? json
? ? ? ? form表單
默認的編碼格式是urlencoded
數據格式：user=kk&pwd=123 ? ? ? ?
Django后端針對符合urlencoded編碼格式的數據會自動幫你解析封裝到request.POST中?
user=kk&pwd=123 ? ? --------》 ? request.POST
如果把編碼格式改成formdata，那么針對普通的鍵值對還是解析到request.POST中， 而將文件解析到request.FILES中
form表單是沒辦法發送json格式數據的?
ajax默認的編碼格式是urlencoded
ajax發送json格式數據
?
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<button id="d1">點我</button>
<script>$('#d1').click(function () {$.ajax({url:'',type:'post',data:JSON.stringify({'username':'kk','age':12}),contentType:'application/json', //指定編碼格式success:function () {}})})
</script>
</body>
</html>ajax發送json格式數據需要注意點
? ? ? ? 1.contentType參數指定成：applicaton/json
? ? ? ? 2.數據是真正的json格式數據
? ? ? ? 3.Django后端不會幫你處理json格式數據，需要你自己去request.body獲取并處理
ajax發送文件
1. ?ajax發送文件需要借助于js內置對象FormData
html
?
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<p>username<input type="text" id="d1"></p>
<p>password<input type="text" id="d2"></p>
<p><input type="file" id="d3"></p>
<button id="d4">點我</button>
<script>//點擊按鈕朝后端發送普通鍵值對和文件數據$('#d4').on('click',function () {//需要先利用FormData內置對象let formDataObj=new FormData();//2 添加普通的鍵值對formDataObj.append('username',$('#d1').val());formDataObj.append('password',$('#d2').val());//3添加文件對象formDataObj.append('myfile',$('#d3')[0].file[0]);//4將對象基于發送給后端$.ajax({url:'',type:'post',data:formDataObj, //直接將對象放在data后面即可//ajax發送文件必須指定兩個參數contentType:false, //不需使用任何編碼，Django后端都能自動識別formdata對象processData: false, //告訴你的瀏覽器不要對你的數據進行任何處理success:function () {}})})
</script>
</body>
</html>2. ?ajax發送文件必須指定兩個參數：
? ? ? ? ? ? contentType:false, ?//不需使用任何編碼，Django后端都能自動識別formdata對象
? ? ? ? ? ? processData: false, ?//告訴你的瀏覽器不要對你的數據進行任何處理
3. ?Django后端能夠直接識別formdata對象并且能夠將內部的普通鍵值自動解析并封裝到request.POST中，文件數據自動解析并封裝到request.FILES中
)
覆蓋優化 - 附代碼)
