07: 三种AJAX
Posted 不做大哥好多年
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了07: 三种AJAX相关的知识，希望对你有一定的参考价值。
1.1 AJAX介绍
1、AJAX作用
1. AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。
2. AJAX = Asynchronous javascript and XML（异步的 JavaScript 和 XML）。
3. AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
2、AJAX与传统开发模式区别
ajax开发模式：页面将用户的操作通过ajax引擎与服务器进行通信，将返回的结果给ajax引擎，然后ajax将数据插入指定位置。
传统的开发模式：用户的每一次操作都触发一次返回服务器的HTTP请求，服务器做出处理后，返回一个html页面给用户。
3、AJAX请求的三种方法
1. jQuery Ajax：本质 XMLHttpRequest 或 ActiveXObject
2. 原生Ajax：主要就是使用 【XmlHttpRequest】对象来完成请求的操作，该对象在主流浏览器中均存在
3. “伪”AJAX：由于HTML标签的iframe标签具有局部加载内容的特性，所以可以使用其来伪造Ajax请求
1.2 jQuery Ajax（第一种）
1、JQuery ajax说明
1、jQuery其实就是一个JavaScript的类库，其将复杂的功能做了上层封装，使得开发者可以在其基础上写更少的代码实现更多的功能
2、jQuery Ajax本质 XMLHttpRequest 或 ActiveXObject
2、使用JQuery AJAX发送请求(django中测试)
from django.shortcuts import render,HttpResponse import json def login(request): if request.method == ‘GET‘: return render(request,‘login.html‘) elif request.method == ‘POST‘: print(request.POST) #{‘name‘: [‘root‘], ‘pwd‘: [‘123‘]} ret = {‘code‘:True,‘data‘:None} return HttpResponse(json.dumps(ret))
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form id="add_form"> <input type="text" name="user" placeholder="用户名"> <input type="text" name="pwd" placeholder="密码"> <span id="jquery_ajax">JQuery Ajax提交</span> </form> <script src="/static/jquery-1.12.4.js"></script> <script> $(‘#jquery_ajax‘).click(function(){ $.ajax({ url: ‘/login/‘, // data: {‘user‘: 123,‘host_list‘: [1,2,3,4]}, // 也可以这样穿数据给后台 data: $(‘#add_form‘).serialize(), //拿到form表单提交的所有内容 type: "POST", dataType: ‘JSON‘, // 让JQuery将data先JSON后再发送到后台 traditional: true, //如果发送的是列表告诉JQuery也发送到后台 success: function(data, statusText, xmlHttpRequest){ if(data.code == true){ console.log(‘返回登录后的页面‘); }else { console.log(‘在页面上添加错误提示信息‘); } }, error: function () { //只有当发送数据，后台没有捕捉到的未知错误才执行error函数 } }) }); </script> </body> </html>
JQuery ajax
以上是关于07: 三种AJAX的主要内容，如果未能解决你的问题，请参考以下文章