AJAX准备知识:JSON
什么是JSON?
JSON指的是JavaScript对象表示法(JavaScript Object Notation )
JSON是轻量级的文本数据交换格式
JSON独立语言
JSON具有自我描述,更易理解
JSON使用JavaScript语法来描叙数据对象,但是JSON仍然独立于语言和平台.JSON解析器和JSON库支持许多不同的编程语言.
AJAX介绍
AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步的Javascript和XML”。即使用Javascript语言与服务器进行异步交互，传输的数据为XML（当然，传输的数据不只是XML）。
AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。（这一特点给用户的感受是在不知不觉中完成请求和响应过程）
AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行.
同步交互:客户端发出一个请求后,需要等待服务器响应结束后,才会发出第二个请求.
异步交互:客户端发出请求后,无需等待服务器响应结束,就可以发出第二个请求.
需求示例:
页面输入两个整数,通过AJAX传输到后端计算结果并返回:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 ????<meta charset="UTF-8"> 5 ????<meta http-equiv="x-ua-compatible" content="IE=edge"> 6 ????<meta name="viewport" content="width=device-width, initial-scale=1"> 7 ????<title>AJAX局部刷新示例</title> 8 </head> 9 <body>10 <div>11 ????<input type="text" id="i1"> +12 ????<input type="text" id="i2"> =13 ????<input type="text" id="i3">14 ????<input ?type="submit" value="AJAX结果提交" id="b1">15 </div>16 {#上传文件#}17 <div>18 ????<input type="file" id="f1">19 ????<input type="submit" value="提交" id="b2" >20 </div>21 <script src="/static/jquery-3.3.1.min.js"></script>22 {#CSS内容#}23 <script>24 ????{#b1触发点击事件#}25 ????$(‘#b1‘).on(‘click‘, function () {26 ????????$.ajax({27 28 ????????????url: ‘/ajax_add/‘,29 ????????????type: ‘GET‘,30 ????????????data: {"i1":$("#i1").val(),"i2":$("#i2").val()},31 ????????????success: function (data) {32 ????????????????$(‘#i3‘).val(data);33 ????????????}34 ????????})35 ????})36 </script>37 </body>38 </html>views文件:
# 视图函数def login(request): ???return render(request, ‘login.html‘)# 运算视图函数def ajax_add(request): ???i1 = int(request.GET.get(‘i1‘)) ???i2 = int(request.GET.get(‘i2‘)) ???ret = i1 + i2 ???return JsonResponse(ret, safe=False)
AJAX
原文地址：https://www.cnblogs.com/caodneg7/p/9801106.html