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,HttpResponseimport jsondef 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
原文地址：http://www.cnblogs.com/xiaonq/p/8013068.html