加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

jQuery与Ajax以及序列化

发布时间:2020-12-15 23:28:33 所属栏目:百科 来源:网络整理
导读:关于AJAX 所谓Ajax,全名Asynchronous JavaScript and XML。(也就异步的JS和XML) 简单点来讲就是不刷新页面来发送和获取数据,然后更新页面。 Ajax的优势 无需插件支持优秀的用户体验提高web程序的性能减轻服务器和带宽的负担 Ajax的不足 浏览器兼容不足破

关于AJAX

所谓Ajax,全名Asynchronous JavaScript and XML。(也就异步的JS和XML)

简单点来讲就是不刷新页面来发送和获取数据,然后更新页面。

Ajax的优势

•无需插件支持 •优秀的用户体验 •提高web程序的性能 •减轻服务器和带宽的负担

Ajax的不足

•浏览器兼容不足 •破坏浏览器前进和后退按钮的正常功能 •对搜索引擎的支持不足 •开发和调试工具的 缺乏

好吧,这些都是几年前的不足。技术的发展很快,这些不足也会慢慢弥补,起码现在调试Ajax并不难。

Ajax的核心是XMLHttpRequest对象,它是Ajax实现的关键。

传统的实现Ajax的例子就不举了,太蛋疼了,我都没记,网上一搜一大堆。

关于jQuery中的Ajax

$.ajax()方法是封装了最原始的js的Ajax方式。

load(),$.get(),$.post()是封装了$.ajax()得来

$.getScript()和$.getJSON()是进一步的封装。

•load()方法 •用处:载入远程HTML代码并插入DOM中,通常用于获取静态的数据文件,结构为:load(url [,data] [,callback])。 •url为请求的地址 •data可选,为发动到服务器的参数对象 •callback为回调函数,请求不论成功还是失败都调用 •载入页面的时候甚至可以在地址里加上筛选

//举一个完整的例子
$(function(){
$("#resDiv").load("text.php",{name:"troy",textInfo:"hello"},function(responseText,textStatus,XMLHttpRequest){
//responseText:请求返回的内容
//textStatus: 请求状态:success、error、notmodiffied、timeout 4种
//XMLHttpRequest: XMLHttpRequest对象
});
});

•$.get()方法 •明显的看到调用的方式不同,所以说这函数是jQuery的全局函数。而此前的方法和load()这种都是对jQuery对象进行操作 •$.get()方法使用GET方式来进行异步请求,结构为:$.get(url [,callback] [,type]) •前三个参数就不说了,唯一不同的是callback只有请求成功才调用 •type参数为服务器端返回内容的格式,包括xml,html,script,json,text和_default •例子

•$.post()方法 •它与get方法的玩法一样,不过一个是get方式,一个是post方式。 •$.getScript()方法 •有的时候页面初次加载没必要获取所有的脚本,所以jQuery提供了getScript这种方法来直接加载js文件。 •例子

• $.getJSON()方法 •用于加载JSON文件,用法同上,只不过返回的json数据而已

顺便扩展一下,跨域访问的JSONP

//JSONP是个非官方协议,采用json与