JQUERY的AJAX跨域请求

构造jQuery对象:jQuery(html),jQuery(elements) ,
$("<div><p>Hello</p></div>").appendTo("body") $(document.body).css( "background", "black" );
$(html),$(elements)
show() show(speed,[callback])
淡入淡出
通过不透明度的变化来实现所有匹配元素的淡入效果
fadeIn(speed, [callback])
淡出效果
fadeOut(speed,[callback])
调整为指定的不透明度
fadeTo(speed,opacity,[callback])
3
一些简单的代码简化
实现为页面的某一区域中的每个链接附加一个单击事件
没有使用 jQuery 的 DOM 脚本
使用了 jQuery 的 DOM 脚本
4
jQuery能做什么?
获取页面的部分内容 修改页面的外观 修改页面的内容 在页面中响应用户的交互 给页面加上动画 无刷新返回服务器端的信息 还提供了改进基本的 JavaScript 结构,如迭代和数组操作 以插件的形式持续地通过开发加入新的功能
$(".myClass").css("border","3px solid red");
根据给定的元素名匹配所有元素
$("div").css("border","3px solid red");

跨域的另⼀种解决⽅案CORS（CrossOriginResourceSharing）跨域资源共享在我们⽇常的项⽬开发时使⽤AJAX，传统的Ajax请求只能获取在同⼀个域名下⾯的资源，但是HTML5打破了这个限制，允许Ajax发起跨域的请求。

浏览器是可以发起跨域请求的，⽐如你可以外链⼀个外域的图⽚或者脚本。

但是Javascript脚本是不能获取这些资源的内容的，它只能被浏览器执⾏或渲染。

主要原因还是出于安全考虑，浏览器会限制脚本中发起的跨站请求。

(同源策略，即JavaScript或Cookie只能访问同域下的内容)。

跨域的解决⽅案有多重JSONP、、Iframe等，当然还有CORS（跨域资源共享，Cross-Origin Resource Sharing）今天就来了解下CORS的原理，以及如何使⽤。

⼀、CORS概述跨源资源共享标准通过新增⼀系列 HTTP 头，让服务器能声明那些来源可以通过访问该服务器上的各类资源（包括CSS、图⽚、JavaScript 脚本以及其它类资源）。

另外，对那些会对服务器数据造成破坏性影响的 HTTP 请求⽅法（特别是 GET 以外的 HTTP ⽅法，或者搭配某些MIME类型的POST请求），标准强烈要求必须先以 OPTIONS 请求⽅式发送⼀个预请求(preflight request)，从⽽获知服务器端对跨源请求所⽀持 HTTP ⽅法。

在确认服务器允许该跨源请求的情况下，以实际的 HTTP 请求⽅法发送那个真正的请求。

服务器端也可以通知客户端，是不是需要随同请求⼀起发送信⽤信息（包括 Cookies 和 HTTP 认证相关数据）。

⼆、CORS原理三、CORS跨域请求控制⽅法1.http请求头Origin: 普通的HTTP请求也会带有，在CORS中专门作为Origin信息供后端⽐对,表明来源域。

Access-Control-Request-Method: 接下来请求的⽅法，例如PUT, DELETE等等Access-Control-Request-Headers: ⾃定义的头部，所有⽤setRequestHeader⽅法设置的头部都将会以逗号隔开的形式包含在这个头中2.http响应头然后浏览器再根据服务器的返回值判断是否发送⾮简单请求。

参数类型说明url 为string（因此要⽤引号引起来）发送请求的地址type string请求的⽅式：post或get请求。

默认为get请求data Object或string发送服务器的数据，键值对，字符串或对象，这⾥post请求有此参数，get请求直接在地址处？后⾯传参即可dataTypestring后端返回给前端的数据类型，⽐如html，xml，json。

本来是string,在ajax请求时设置dataType为json，将字符串；类型变为json类型succ ess function请求成功后调⽤的回调函数，需要操作的东西⼀般在这⾥写⽤法success:function(e 这个字母e可以是其他英⽂){写内容} 注意这个（）⾥⾯的e或者说其他东西就是后端HttpResponse或者JsonResponse返回的东西，这⾥与dataType有关error function请求失败时调⽤的回调函数asyn c Boolean是否异步处理，默认为True,false为同步处理ajax--实现异步请求，接受响应及执⾏回调ajax最⼤的优点是在不重新加载整个页⾯的情况下,可以与服务器交换数据并更新部分⽹页的内容ajax指是⼀种创建交互式⽹页应⽤的⽹页开发技术，其实就是实现前后端交互。

1）ajax是异步javascript，异步的意思即⾮阻塞，就像线程，在代码运⾏到ajax请求时，它会分成两条线，⼀条线去运⾏ajax请求⾥⾯的内容，另⼀条线去运⾏主程序（即ajax请求后⾯的代码），当然我们可以因需要异步设置成同步（即在运⾏到ajax请求时，将阻塞运⾏完ajax请求后，再去运⾏ajax外，后⾯的代码）2）注意ajax请求是由jquery发起的，因此⽤于jquery代码块中。

3）执⾏相应的视图函数（这⾥是在⼀个py，php等⽂件中创建⼀个视图函数，或者class类，给这个视图函数分级设置⼀个url地址，ajax请求中的url即填写这个完整的url地址），返回json内容。

JQuery中$.ajax()方法参数详解url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。

type: 要求为String类型的参数，请求方式（post或get）默认为get。

注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。

timeout: 要求为Number类型的参数，设置请求超时时间（毫秒）。

此设置将覆盖$.ajaxSetup()方法的全局设置。

async：要求为Boolean类型的参数，默认设置为true，所有请求均为异步请求。

如果需要发送同步请求，请将此选项设置为false。

注意，同步请求将锁住浏览器，用户其他操作必须等待请求完成才可以执行。

cache：要求为Boolean类型的参数，默认为true（当dataType为script时，默认为false）。

设置为false将不会从浏览器缓存中加载请求信息。

data: 要求为Object或String类型的参数，发送到服务器的数据。

如果已经不是字符串，将自动转换为字符串格式。

get请求中将附加在url后。

防止这种自动转换，可以查看processData选项。

对象必须为key/value格式，例如{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。

如果是数组，JQuery 将自动为不同值对应同一个名称。

例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。

dataType: 要求为String类型的参数，预期服务器返回的数据类型。

如果不指定，JQuery将自动根据http包mime信息返回responseXML或responseText，并作为回调函数参数传递。

可用的类型如下：xml：返回XML文档，可用JQuery处理。