6. 尚硅谷_佟刚_Ajax_使用 jQuery 实现 Ajax

我们后边的重点是什么呢？我们是使用j query如何来完成Ajax操作，往后翻一下。看哎，解query里边如何来用AX，解宽里边用那个AX啊，非常的简单，因为解query已经把底层的这个什么open啊，肾的呀，包括什么UN ready state change啊，Status啊都已经封装好了啊，你直接叫方法就可以，它有几个层次哈，第一个就是你用原生的aja，第二层你可以用road get跟post，你还可以用get a script或者是get，杰森最常用的呢，是中间的这几，中间的这几个方法我们看一下，打开找到jaquiry。看一个方法啊，有漏get get，接森，当然还有post，我们看那个漏的方法了，漏的方法呀，传一个ul进去，中间是请求参数，这是回调。

函数哦，我们可以写的这么样子复杂一点是吧，你也可以直接写成一个URL，这个漏的这个特点是什么呀？这是任何一个HTML的这个元素都可以来调它啊，我们来举一个例子，大家看一下漏的方法来漏点加T。我们还是把这个的话呢，复制一下CTRLC。现在啊，我这个需求变了啊，需求变成什么了，我希望把这个文档的内容呢，就是么，Hello h X这个笑脸啊，放到我底下这个div里边。

Count这个意思吗？我希望我点这个套链接的时候啊，我能把这个结果直接放这个里边，我当然我们用前面那个也可以写啊，现在我们来用这个解块的这个漏的方法来试一下。Script。30、你把铁块库导进来吧，找到铁块瑞库。J query。最新的我找的最新的是1.7哈，是你现在2.2.0啊，包括这个的话呢，我们来说影响不大，核心的方法的话呢，还是这些。筹备好了，好出来。

啊，用一下。是我们特别希望看到的这个情况，并且宽RY用原生的JS省了很多很多，好了，先拿来吧，我们确定是为什么呀，是不是为这个A节点添加可显示函数啊？然后找的吗？放学摸式行为吧，啊注意使用这个的方法，漏的方法发送处理AX吧，处理AX看一眼哈。怎么用呢？这个时候啊，这个load方法可以直接用在这个上面，我直接让它load就可以了，井号count.load然后ul是谁呢？Ul就是were ul等于this.crab这days是谁呀？这个days要是这么写的话，是那个盗对象吧，不是写块对象啊，然后ul。

写完就行了吗？看一下你就知道行不行了。是不是行了呀，Hello aja诶发现什么呀，他是不是有这个什么，它是不是有这个叫这个缓存啊，我们把这个缓存给它解决一下，我们希望再给它加上一个参数，X等于X次方的不一样吗。六对保存刷新。

哦，复制一下应该是应该是好用的哈，看一下。重新的给他启动一下。服务器关掉。A taste load。找一个。什么破玩意，没好使是吧，看看哦，没加是吧，光写这个没用哈，这块。快手。就好了吧，缓存这个就去掉了，行了，这是我们漏的方法，那你想嘛，是吧，这要是不用漏的话，我们要自己原生写的话，是不是还挺麻烦的呀，原生写你得获取到那个response text吧，然后创建一个文本节点吧，加进来你看这个就非常的简单，看漏的方法，说第一个方法就漏的方法，这是解query最简单也最常用的方法，大家注意这两个词哈，简单常用，常用的都是简单的，简单的往往也是比较常用的。

能载入远程的HTML代码，直接插入到do里面，结构load ul data call back，你后边你可以指定一个什么呀，你可以指定一个回调函数，我们只需要像这样是吧，我为这个里边插入这个结果就可以了，你看ulx这两个参数就可以用，细节的话呢，你看一下可以有一些细节哈。如果我们希望只获取呃这个返回的HTML文档的一部分，我们是可以用这个选择器的，就ul跟选择器之间可以加个空格，我们还可以指定这个get或者是post的方式，如果你要是呃传data，这个data要是直接放在ul的后边，就是get方式，如果你要是用参数了，就是说我加上这个第二个这个请求参数的话，就是呃，Post的方式，还有一个呃，你也可以使用这个回头函数，这个回头函数用的机会的话呢，并不是特别多，来我们看一下第一个跟第二个，这个时候的话呢，我把我们前面这个改为DEC query我上去。

打开。这个改为几块版本的。

Text Java。SR是谁？Ris下编的。不止。这个吧，CTRLC，为什么要写个点点啊，这不上一级目录啊，好了，这些不要了，大家看我用笔来写哈。呃，首先有A节点。一点点不能这么写吧，你先你解放是吧。节点的click。Function return OK，谁家呢加你说C拿过来顶，Video减log。

Or ul等于K点。与时看哈ul。就成了找一个先。复制，我们拿它来看。网络大家看我点一个是不是有了。他就是你看OK返回的没问题，每次都是这个，我们看这是个什么请求啊。这是一个概的请求，因为我没加参数吧，怎么写括号X等于这么写这层格式啊，格式一定都是阶层格式new对，直接传X再看。

发心走个好用啊，看是不是POS请求啊，啊，这是我们说的第一点，但是get跟post其实无所谓，这关系不是特别大，好了，第二点，第二点挺实用的，比方说啊，我请求，我请求之后的话呢，我只想要一部分这个意思，我点一下，你看我返回这东西太多了哈，我只想要H2这部分看清了吧，而后边的这个A呀，不想要了，怎么写呢？我们可以在这个上边加上一个选择器。只要HR部分。我写了哈，我只要HR部分再看。再走一个。是不是就是H2部分好了，看这个原理，那实际上回来的呢，是不是还是全回来了呀，它是在已经回来这个基础上，只选择了这个H2，看到了吧，好，那我要是要只要H2里边这个A呢，是不是写个A呀，这个是我URL跟选择器之间的那个空格，而这个空格呢，是不是负元素跟子元素之间那个空格啊这种。

啊，一样的，没问题，这就是我们的。漏的请求，就漏的这个方法，用解块的这个漏的方法的一些细节看一下吧，非常简单啊，我们来说一下它任何。一个HTML节点都可以。可以使用漏的方法来加载，然后呢说结果将直接插入。

到。啊，这个HTML节点。Big。归位它的这个主节点直接放这块可以了，这就是。漏的方法，那这个漏的方法的话呢，我们这块我们已经改写了一个了啊，这改写之后的话呢，非常的简单，再看一个get跟post，这两个也很常用啊，Get post我们看哈，第一个是ul，第二个是data，就是那个传的变量，当然也是阶层格式，然后是一个回调函数，然后是一个type，我们来做一个实验，大家看一眼，我直接来给它。

XML。你改这个改成二回来。这个需要复制一下，你说C过来。打开。好，你说D看怎么用。然后呢？首先获取所有的A节点加click怎么写？Function。Post好了，然后使用get请求，跟post请求用的方法一模一样，就是一个是get，一个是post。于是我先准备ul等于点或X等于。

Time time，下一个。发请求get请求，看着哈，Urlx好了，这个结果在哪？注意哈，这个方法是解宽对象的方法，回到这个里边来，你看这个时候怎么了，这个时候这个结果是不是直接就放在这个里边来，而这个结果你得自己安排，结果在这个里边呢？结果在回调函数的参数里。丢在这儿。啊，就在这，然后的话呢，我们同样需要去获取那个name email跟website怎么获取啊，For name等于什么的，我把这个data用quiry这个工厂函数一包装的是什么呢。

是不是几块对象了，我直接去找哪个节点啊，找这个name节点获取这个文本值不就可以了吗？好，同样的。第二个应该是email。Website。过。好，我们再看一眼这个XMXML。是吧，Name节点的文本值吗？搞到搞到之后呢。我要直接创建节点，放这个里边直接写，你说C点一个顶有没写上。

给pen。当然了，这个喷子之前我得先怎么了。是clear吗？还是empty，我先帮我节点去除，然后加呀，为什么呢？第一个这个样子是不是H2的样子。于是我看一下吧，这边应该还有我点它啊H2的样子，来CTRLC过来。就十几块，它简单的。好吧。改一下。他改成什么呀。改为email。Email是吧，改成什么呀。

一个完事那块RY这个对象支持方法的连缀，所以说你下面你还可以继续OK。CTRLC好，第二个结果是什么样的呢？这样的。Clc过来。一家。这个不能要啊，哎。就哭了，你改为什么呀？Website。喂吧。三也一样。外包哎，好有一个看看效果。

复制拿过来。粘贴好看着哈，点一个好用的看。发的请求都没问题，就get请求啊，这是什么呀，响应的是一个XML，这个结果价位没问题，我们看一下这个源码。哎，的确是用解块RY写的，这就可以了，这是get请求，怎么改成请求啊，直接把这个变为就可以了，保准再看来他。刷新找一个看，说post呢，没有任何区别，所以说get跟post几乎是一样用的，看看这个post吧，UL2需要说的就是杰森格式。

好了，第三个就要说function，就是要回调函数。怎么就回调函数来当响应一数值？回调函数被触发。同时要说响应结果。在回调函数那个贝塔。这个变量中检验结果。结果在推塔中这就可以了，这就是用poose的这个基本方法，而里边这个是怎么回事，里边是不是这就是纯粹是几块，我把这个一包装，它是个什么东西，它不就是个几块对象吗？我去找name子子节点，诶1EMAIL有子节点，Map子节点，我直接可以用了。

好了，完事，那再找一个吧，我们还有一个杰森呢，上去改成杰森。跟前面这个使用方式啊，几乎一样，不来。Okay。好了，我把这个呢，直接复制一下。CTRLC来。你稍等啊。取了几块这个感觉啊，就是不一样，就是简单嘛。这个值不能这么获取了吧，我告诉他一声，我请求的是杰森格式的，或者我们有一个方法叫get杰森，直接get就完了，然后看这哈，直接写点person.name。

他就直接给你转为S了，贝塔角森角。一秒再来。贝塔点森点web塞找一个，那是带的方法。你点什么？复制看这个好点一个没问题，是接的吗？源代码，哎也的确是用的是哎JA这样的话呢，我们把前面这个三个数据格式都改为使用解块的方式了，那解块里边最常用的三最常用的四个方法吧，第一个方法叫load。

我还写了一个啊，这里面也有close all，我们直接看我们这个三个格式就可以来看这个。这里边用的是漏的方式，注意我这个节点还是加到了A上边，但是怎么样啊，我是使用这个details，直接把那个结果放这个里边，这就是load啊，Ulxx是杰森格式的变量，好了再看get或post方式，这里这里边写的看这。来直接post或者是get URL目标X请求参数计算格式的，然后function这个data是那个返回结果，那返回结果本身是一个XL格式，我一包装变成了一个。

取块对象了吧，我就范的方法去找names节点，找这个文本值，然后一拼就可以了，好了最后一个叫。杰森，我们写了个盖杰森方法过来，杰森to在这呢，哎，这里边我写了个盖杰森哦，这个太恶心了是吧，这不是。坏了，我改的好像是第一个。反正我是改了是吧，行，你看啊get杰森，其他都一样，直接返回的是什么？直接返回的就是一个接分对象，你就可以直接点了。好了，那这里边的话呢，我们还要再说一个，就是哎，我要使用get方法，我告诉他反我我就这么写他能行吗？试试哈。

这是找一个。不就这个吗？哎哟。大家看这结果是对的吧，但是没解析上，就是说你得告诉杰块瑞是吧，我回来的是杰森数据类型怎么写啊，我们还有一种方式就是在后边写上一个是一个杰森数据类型支持这个类支持他吗。BT里边我们后面不是有个type吗？呃，阶层类型好了再试一下。好使了吧，啊，这样也可以，或者你直接用刀符点get杰森一样。到这块的话呢，关于HS的基础知识就讲完了，来做一个小结，看一看我们要是掌握的话，到底掌握什么，第一个哎，我们需要知道什么是aja，大家说现在我们知道什么是HX。

不刷新页面，可以跟服务器进行通信的方式就是不用刷新页面，但可以和服务。呃，进行通信的方式就是AX，我们提一下，实现AX主要方式是用xmlhttp request对象，实现AX的主要方式是。Xlhttp request就像O了，第二个我们对这个对什么使用这个对象直线HX。

做一个了解这个呀，上午写了好长时间是吧，是不是很费劲呢？这个级别就是一个了解，大家不用特别去纠结它，因为开发的时候啊，基本上都不用它。要么是用j query，要么是用其他的JS框架，要么也是封收好的一个方法，原声的去写什么open啊，Send啊，那个太out过时了，来来，下边有一个重点的内容是吧，就是嗯。A，传输数据的三种方式aja传输数据的三种方式好了，这个呢，确实是比较重要，我们首先首当其冲的是不是有个XML啊，这个现在用的少了，XXL比较笨拙，解析起来比较困难，笨重，解析困难困难，但并不意味着这个不用，因为什么呀，如果我们一定要选一个通用的数据传输格式的话，这个可能就是XML。

但XL是通用的数据交换格式。

哎，是需要知道的，第二个的话呢，就是这个HTML啊，这个我们用的挺多的，特别是我们只更新一小块的时候，用这个HTML特别的方便说。需要解析可以直接放到文档中啊，说若隐更新。紧庚心一块，我们就只就这一块哈，这个呃一块这个一部分吧，是吧，区域的话，这个时候可以考虑使用它。看呢，这个传的数据啊有限，比方说你就加一个用户名，是不是可用了，你传这个东西非常方便，但是我要是比方说我要想传的传的东西我是一行，比方说有TR有TD，拿这个传就不好了，就没有那么方便，但传输。

的数据这个有限，这个有限是什么意思，不是不是特别方便吧，是吧，不是很方便。然后呢，T还有一个非常关键的是吧，HTML代码需要拼装。完成这个比较不爽，你需要拼写好了三哎，我们还有个接字。这个是呃，使用的很多的小巧。然后怎么样有面向对象的特征。且这个一共有有很多第三方的大包，可以把什么呀？把Java的对象或集合转为杰森。

那这个的话呢，是目前用的最多的一种数据格式，所以说这个HX传输啊，最多的是杰森，然后是HTML，这个反倒用的最少好了，四我们讲的就是实用。Quiry完成好了，一个一个说第一个有一个叫漏的方法，对方有什么特征啊。可以用于HTML文档的元素节点。然后呢，把结果。

直接加为对应节点的子元素，但是通常情况下这个漏的方法加载之后到那个那个数据应该是一个HPL格式的是吧，通常而言这个漏的方法。加载后的数据是一个HTML频段，好了使用方式。这样写，比方说你开始的话呢，你已经有一个对象了哈，我一个比方说element。Obg等于什么什么什么是吧，然后是呃，OBg.mode指定一个ul，指定一个X就可以了，一个ul等于。

或一个X等于，我们说这个X一定是一个阶层格式。Key。哎，就这样用好了，第二个叫盖子。Post还有一个什么呀，看杰森用的方法差不多好了，这怎么用呢？哎，这个更加灵活，更加灵活。如果你要是仅是为某一个地儿加载一个HTML的话，这个是首选，但除此以外的话，用的基本上都是这些，然后说除去。这个除去使用漏的方法的情况，大部分大部分时候都使用，呃，第三个方法是吧。

三个方法好怎么用呢？以其中的一个为例，大家看哈，X是什么呀？用L吧，Dux function。啊，其中呢，有三块是需要我们自己填的ula请求的目标ul，第二个呢。传递的参数，传递的参数什么的。杰森类型还有一个推塔，推塔是什么呀。

怎样成功？响应成功后的数据可能是，比方说可能是一个XL啊，HTML可能是杰森啊，要是用杰森的话，你怎么用呢？这块加上一个杰森，我们写一个哈来角，一基本使用吧，是吧，基本的使用好了。二、请求杰森平均的数据我们可以怎么写，对不起点get ul X function塔写完，注意这块写个杰森，我请求的是杰森类型。

这个data呀，通常情况下需要解析，以确定把这data数据放哪好了，还可以怎么写，还可以这么写。把这个换成post还可以怎么写，可以这么写，CTRLCCTRLV就get这就可以了，就这样的三种方式，那通常情况下，在这个回调函数里面需要解析data塔，然后呢，更新这个，呃，HTL文档的哪一个部分。