jquery ajax请求的五个步骤
粉丝1712获赞2.8万
相关视频
01:22查看AI文稿AI文稿前面说了 j q 的 ajx 方法如何跨越请求，现在说一下在跨越请求的情况下如何把 cookie 带过去。为了说明这个问题，先在客户端保存一个 cookie， 然后在 aject 的配置对象中设置一下 x h r fill 字属性，把 x h r fill 字属性对象的位子可单词 o 字设置为 true。 在服务端接口中接收客户端的 cookie， 然后把 cookie 一直返回给客户端 保存。测试一下 点发起请求一直是请求中， 在控制台查看一下报的错误信息，还要把这个属性设置为处，这个属性要在服务端接口中设置。 最后再试一下， 成功获取到了服务端接口返回的 cookie 值。以上就是完整的 ajx 跨域请求携带 cookie 的流程。
12纯人代码
01:24查看AI文稿AI文稿这节课来看 jkry 的阿加卡的方法，通过一个 get 请求来看他是如何使用的。来看代码引入 jkry 文件，这里是一个按钮，点击这个按钮获取数据， 里边使用最科瑞的 rgs 方法来获取数据，语法是得了符号点，后边是 rgx 方法，这里边都是参数选项。 第一个 ul 是请求地址，这是我自己电脑上的一个加油项目。请求方法类型是 get 的方法， 返回数据类型是 js， 这是请求成功以后的回调函数，参数是后台返回的数据。 把这个数据打印出来，其实他已经是一个对象了，不需要我们通过杰森转换对象，然后把他的每一项设置到 网页上。这块的获取元素，这个特色方法是设置元素的文本内容作用跟 js 的音呢， html 这个属性差不多。来看效果 获取数据，答案呢？这是一个对象，网页上展示了这三个值， 这是一个简单的 get 请求，我们可以对比一下上上节讲的 js 的和 js 的写法，是不是比那个简单多了。好了，这节课就到这里。
107人人都会软件编程
18:48查看AI文稿AI文稿好，上节课咱们是讲到这个阿贾克斯发送请求啊，用的呢是叉 m l h d b d request 啊，但是呢这个呃请求现在是发出去没问题了，有一个小问题就是说我发请求的目的是什么？ 哎，咱们发请求的目的是不是得到这个后台后端给咱们返回过来的数据啊？ 对，所以说下一个问题就是怎么得到这些数据啊？那怎么得到这些数据呢啊？这个就得使用这个方式。就说啊 啊就说呃叫 ready state 的 change 啊 ready state 的 change 这是一个 什么呢？这是一个事件啊，叫做 x h r 的 on ready state change 啊，有这么一个 有这么一个事件啊，这个事件是什么呢？就是你看啊 on 就是当什么的时候啊，或者是在的意思啊，就在 ready 是什么意思？等待，因为你的请求发出去你就只负责等就行了，对吧？ 是不是？哎你就等就行了。 today 就是等待状态对吧？等待的状态啊，然后接着称之是什么呀？ 甚至就是改变啊，改变啊，就好像说这个 s n z 是 h r 是什么呀？是一个宋军出征的，就是宋 自己的丈夫出出征的这么一个妻子，对吧？啊那这个一旦送出去以后那么 你就只能等着，对吧？那等的话有有可能是什么什么呢？比如说出征就是战死，对吧？啊那这个就是就是什么？就是失败 是这意思吧？啊？那如果成功的话那成如果说成功的话是不是就有一些个就说阶段，比如说啊你的这个这个大军已经攻克这个敌军，对吧？这是一个啊攻克地方升职然后第第二个班师回城 对吧？啊第三个啊就是说呃卸甲归钱是这意思吧。啊 那同样的类似的啊就是咱们这个请求如果在失败的时候那没什么好说的这个就就不用管了但是成功的时候他有这么几个状态零一二三四啊有这么几个状态零是什么意思呢。零就是说刚刚出始化啊就是你刚拗完 啊你刚溜出来啊接着一是什么呢一是这个哎一是这个请求已经呃装载好数据明白吧啊请求已经呃装载好数据 啊因为这个 open 就是 open 了啊就是或者说就是也别装载好数字就是调用了调用了 open 方法但是还没发出去啊啊那这个就是什么呀就是东市买玩具嘛西市 买完安边是吧还是安三安间是吧好忘记了啊啊然后这个啊北市买什么啊啊对对对男士买商边是吧就这些东西已经准备好了啊 对不对整装待发啊然后二是什么呀二就是其实就是什么呢就是啊不是啊二的时候其实已经是打完仗准备回来了 来吧就说请求投。呃不是叫响应投啊响应投已经回来了就是说什么意思已经接收到战就是捷豹那个 就家里人已经知道打胜打胜仗了对吧但是人还没回来能理解吧哎那这个三是什么呢三就是说这个 这个不能说是人回来了。那那我举的这个例子不太恰当啊就说人就说这个响应已经接收到但是没有全部接收啊什么意思就说人回来了一部分 对吧但是人人还没有全回来啊哈哈哈这个这个就说实话我举的这个例子就是是这么一个问题明白吧。啊马回来了啊对马回来了啊可以啊可以啊啊然后四的时候就什么就是全回来了明白吧。啊但是 数据他可以分开人不能分开明白吧。你明白我意思啊就这个响应已经接收完毕啊接收完毕数据可以被使用了啊数据可以被使用了就说或者说你 把它理解为去拉货可以吧。啊就说零的时候哎我刚刚雇了一个货车一的时候啊我告诉了货车往哪走往哪开对吧啊去干什么啊然后接着二的时候就什么呀啊车头已经回来了对吧啊或者或者就说啊 挂式好挂式啊啊三是什么呀三是什么呀啊三就是车头这车整个已经回来了正在卸货明白吧。卸了一部分啊四就是什么呀卸完了啊货全都卸完了。 所以说在这个地方我们其实只关心什么我们只关心几四啊所以说在这里啊我们通常只关心只关心这个 四啊所以怎么办呢只判断几啊判断四就可以了啊这个事件啊这个事件这个事件啊事件他会在每一次状这个状态就是这个状态状态值啊切换的时候 啊切切换的时候干嘛呀啊触发一次也就是说这个事件会触发几次 啊。退出发四次啊零变一一次一变二一次二变三一次三变四一次四次 是吧。嗯我们通常只关心四所以我们只判断四啊。那我们 现在来输出一下啊输出这个叫做切换了啊切换了保存啊来刷新以后啊注意看啊。我这么一点，哎是不是只剩下三次啊有的说那不是四次吗啊这个其实就得 看这个状态了啊。零和一一是什么呀？一是调用了 open 方法，也就是说在你调用了 open 方法以后他状态就变成一了吧， 而他变成一的时候你有给他绑定这个事件吗？没有说他是不是监听不到啊。哎你如果想让他监听到怎么办你给他放前面去 能理解吧。哎你给他放前面去，那这种情况下哎刷新以后一点是不是几次四次啊，都是五十行输出的啊都是五十行输出的，所以说这种情况下他的他就能够接听到啊。那这 这样的话咱们这个也就说这一段在吗他其实放前面放后面差不太多啊，但是咱还是放前面吧啊咱还是放前面 好了。那这样的话就说这四次已经啊都监听到了。我们通常只关心四所以说我们一般怎么样只只只在四的时候啊 那就去做事情。那这样的话咱们得判断一下子。怎么判断呢？就是输出这个东西啊，叫 x x 的 ready state 啊，这个 x 有一个属性叫什么呢？叫 ready state。 这就是那个状态值啊就是那个状态值。刷新以后一点一二三四对不对啊。一二三四啊。零的话那监听不到没办法，因为你刚一出的话 大概就是多少啊。 console 点 log log x c 叉的 ready 准备的啊，保存啊，来一刷新一点就是几就是零啊一点就是零 啊。那这样的话咱们就是说如果 x x r 的 ready space 等等等于四对吧。哎那这时候说明什么呀？说明请求已经结束啊，就已经结束啊。那这样话我们要在请求里边干嘛呢？啊？ 得到返回的数据啊，那返回的数据在哪里呢？在 x n x 的 re response tent 这个属性上啊，在这条属性上 response 是响应 tent 的，是文本，是不是 响应文本啊？啊？那输出这个 x h r 的 response technical 啊， technical。 哎， 行，那这样的话这个刷新之后一点一二三都都没有输出只有四的时候输出了一下返回的数据，那这样你看这就得到服务器给我们前端返回回来的数据了，对吧？哎，但是这个数据你看它是个什么格式 字不差，因为什么呢？因为就说前端是用用的语言是什么语言？ gs 吧，后端用的语言是什么语言？谁规定只能是炸丸？ 是不是都可能啊？对，有可能是 php， 有可能是加腕，有可能是 python， 有可能是咱们这个，这回咱用的是 note 服务器，明白吧。啊，那这样的话就有一个问题啊， 不同的语言之间怎么传递信息？比如说前端给直接给后端说，哎，我把我的数组给你，结果服务器那边一接过来一看傻眼了，我这边没有这种类型啊，对不对啊？那所以说这时候就得怎么办？ 哎。找一个两边都认识的语言，都都都都认识的数据类型，对吧？那什么数据类型通用的对， 什么死语四座串。我问的是数据类型是通用的，能能理解吧。啊？你说哪个语言里边啊？除了一只电脑和四二三四以外啊。 除了除了这两个，这两个其实不能叫动态语言，能理解吧啊，但是一个是标签语言，一个是样式管样式的啊，所以说那个咱不管啊，那这个只要是这种动态语言啊，能运行的这种语言啊，他都里边都一定有字幕串吧？ 对啊，所以说呢，前端和后端之间传递数据的时候用的是什么字？不差，所以说你看这是瑞斯 boss 什么， 这是都是有原因的啊。好了，那这样吧，下一个问题就是我怎么把这个四步串给转换成咱们前端的对象， 对吧？因为你看啊，你，你前端拿到这个以后啊，你从这个字幕串里拿到，我问一下，从这 这个图片里拿到这个，你好，这这一块数据怎么拿？截取吧，而且最麻烦的是什么？最麻烦的是你根本不知道，如果这次是请求失败了，那他给你返回个别的东西，你代码是不是得重写？ 对，所以说用这种用字不串的方式很不友好，那怎么办？如果我能把这个东西格式化成咱们对象，是不是也很棒， 对吧？啊，就很棒，那这种情况下，咱怎么把一个字不串格式换成一个对象啊？当然前提是你这个你这个字不串的格式，你得是符合对象的，能理解吧。啊， 好，那这这个其实就是什么呀？就是后咱们已经通过一步的 g s 得到了什么，咱得到的不是叉 m l 是什么？ jason， 明白吧？ jason 这种数据格式叫做 jason 啊，这种数据格式叫做 jason， 也就是 jason 是个什么东西数据格式啊？ jason 是个格式啊，就说只要符合 啊， jason 啊，就是只要符合 t 冒号 value 的这 value 的这样的格式啊，啊，那么就可以叫做 jason 啊，就可以叫做 jason 啊， 行，那这样话，而这个 jason 在咱们 g s 里边恰好就是什么呀？啊？而这个 jason 格式啊，在前端里恰好就是，哎，恰好就是数组合对象。 数组是不是 k， m 和 value 的格式？数组咱们在写的时候咱们不写 k， 对吧？但是你能不能理解数组它也是锁引对应成员的格式对吧？ k m 和 value 嘛？ 嗯，而 jason 格式在前端里恰好就是数足的对象，所以说呢，我们现在想办法将这个啊 jason 格式化成什么样对象啊？格式化成对象，因为数足也是对象啊， 那这样话，怎么把它格式化成对象啊？啊，在这里咱们就得介绍一个 e s 五里边的办法啊， e s 五中啊，其实是新增了一个 jason 这么一个对象 啊，新增了 jason 这么一个对象。这个对象有两个方法，一个叫什么呢？ horse， 一个叫啊，是均反 啊。 pass 是什么意思呀？啊？ 咱们那个 pass int 是什么意思来着？解，解析成数组，解析成整数，能理解吧？所以说 pass 是解析的意思。那 stringfine 是啥意思？ stringfine 是字幅画啊，字幅画 啊，那这个说一下吧啊？ jason 点儿 cars 啊，它的参数是什么呢？是一个字不串儿，是一个 jason 字不串儿啊，那么它的作用可以将 啊啊，这个参数字符串啊，那么这个转化成对象啊，转化成对象啊，那么 json 点咨询返，那这这个是个什么呢？这是一个 obj 啊，那么它的作用可以将什么呀？可以将 这个参数对象啊，把这个对象格式化，格式化成四步串啊，格式化成 jason 四步串， 那这样的话，咱们现在你看啊，这个东西它就是一个 jason super 串， 我现在要把这个 jason super 串 转化成一个对象，那怎么做？ 用哪个方法呀？ cars 啊，所以说这弯一个又就是因为 那这个东西啊，那就我就把这个 x z x r 的 respons tact 的给返回啊，不是给给解析，解析以后是不是得到一个结果，这个结果你得用一个变量来装吧啊？玩一个 o b j 啊，等于啊，那这样的话呢，我们就可以输出这个 o b j 啊，保存，那么来刷新以后一点，你看啊，上面还是个什么 super 串，下边就变成一个对象啊，就变成一个对象 好了，那这样的话我们就可以输出这个对象的 arrow， 这个对象的 data， 这个对象的 message， 你看啊，现在想要得到里边的这个数据是不是就对象的属性了啊，刷新一点 对吧？哎，这就得到了，那如果说后端给咱们返回一个叉 m 二格式的数据，那么我们只要掌握了把叉 m 二格格格式化成对线的方法，这不就可以了啊，但是那个方法太复杂咱就不讲了啊， 已经很多年没有人用了啊。行，那这样的话咱们现在就已经正式得到什么了啊？得到这个呃后端给返回的数据啊，对，顺便我在这里说演示一下这个 for， 我只演示这一遍啊 for 是什么意思来着？ 同步对吧？好，那注意看啊，这个啊，我，我在这里还是这个处，然后怎么样啊？ console log， 这 叫做，呃，我是，哎，我是一个大帅哥对不对啊，那注意看啊，咱们来看一看。点了，提交以后这个我是一个大帅哥，会在什么时候去输出？ 什么时候没有？等这个请求回来吧。没有哎，也就是说请求刚一发出去他就怎么样了？哎，他就输出了， 对吧？哎，他就输出了啊，然后接着我再把这个地方换成 boss 啊，来吧。哎， boss 啊，保存。那注意看刷新以后一点提交怎么样？什么时候输出呢？请求 回来以后啊，结束以后。那这样的话，如果这个请求瞬间回来，那可能你用这个 boss 没什么感觉对不对？但是你能保证网络状况吗？不能，所以说咱还是怎么样啊，用数能理解吧。啊？用这个数 好了，那这样的话呢，这个阿贾克斯发送 get 进球咱们就说完了啊，那这样的话还是给大家一段时间啊。啊？二十分钟啊，二十分钟，练习一下这个啊，阿贾克斯发送 get 进球。
02:12查看AI文稿AI文稿什么是阿贾克斯？那么我们该如何使用 g s 发起阿贾克斯请求呢？ 阿雅克斯呢？它是一种用于创建交互式和动态网页的技术，他能允许使用 gs 在不重新加载整个页面的情况下和服务器进行数据交换。 下面呢是一些发起阿蒋克斯请求的一些步骤。第一个呢，就是需要我们创建一个叉 m l http request 对象，那么我们可以通过下面这样一行代码来创建这样一个对象。 第二步呢，就是设置请求的类型， u r l 和是否异步。我们可以使用 open 这个方法来设置请求的类型，也就是 get 或者 post， 那么 u r l 和是否异步？接下来这一行代码就是使用了 open 这个方法，首先设置盖， 然后去请求 u i l， 接着是否一步。第三个呢，就是注册一个回调函数，用于处理服务器响应。可以使用 already state change 这个属性呢，注册一个回调函数，该函数在 red state 属性改变时会被触发， 通常在 ready state 等于四的时候，表示请求已经完成，并且呢 studios 呢，它等于二百，也表示成功响应。这个时候呢，哎，就可以去呃处理服务器响应，例如下面这几行代码。 ok， 那么最后呢，就是发送请求，嗯，我们可以使用送的这个方法呢去发送请求，如果是 pose 的请求，可以将数据作为参数传递给送的这个方法，例如下面这一行代码。好，那么以上呢，就是我们使用纯 gs 来发送阿贾克斯请求的 基本步骤，但是呢，现在的 g s 框架，比如 g curry， axus 等，提供了更简单和更强大的方式来处理二甲克斯请求，这些框架呢，封装了底层的二甲克斯操作，简化了代码和兼容性问题，并且呢提供了更好的错误处理和更丰富的一些功能。 在这里呢，需要大家注意的就是阿贾克斯发送请求的这个步骤呢，大家一定要记住，尤其是 open 和 unready state change 里面的 ready state 和 studios 这两个值，大家一定要记住， okay。
53小鹿线-黄老师
04:24查看AI文稿AI文稿介绍完刀了，呃，炸个死的方式之后，我们发现这种方式非常的简单，那么我们只需要找到这个箭对应的含义，我们在里边添加这个箭直对就可以来完成这个操作， ok 吧，那么比较常用的箭呢？有这么四个， u， r， l， tiple， beat 以及 sxx， 那么还有一些其他的， ok， 那么我们可以接着往后边斜，那么比如说呢，在这个地方还有一个有死的 face， 还有一个呢，对应的 l， 来找一下 l。 艾瑞呢？在哪个地方？稍等，在这艾瑞他呢表示了，如果发送请求出错了，他会去执行的毁掉函数，艾瑞 呢，里边也绑定一个方式，那么这个地方呢，他是表示表示表示如果请求响应出， 出现好，出现错误，会执行的回掉函数。好，那么比如说我们在这谈一句话，叫做 elat 俄 lit 是啥呢？ 出错了，好，第二点。好嘞，那么怎么样出错呢？比如说我把路径改一下，路径找不着啊，现在是这样的吧。好，我们在这个地方刷新， 刷完了之后呢，接下来，接下来我们在这清空，然后呢点击发送一步请求，你看出错了，为啥呢？这块报了一个错误的状态码，四零四， ok， 好嘞， l 有可能会用到，那么还有呢，比如说在这个地方再来注意啊，我在这个地方故意没有写逗号，你看每一个箭字对后边是不是一 应该以逗号进行完成一个分格啊？好，我这没有写逗号啊，还有什么键呢？比如说响应的一个数据的格式的规定，对他太这么一个字。好， 那么注意，我们再来演示一下，对他太，那么对他太不，现在这个值呢，表示了，表示了设置 接收到的响应数据的格式，格式，那你注意看，他有很多的取值啊， xm， 二 htm， 二四，亏本的 jsn， jcp， tx， 那么现在呢，你看一下他说预期服务器返回的数据类型，如果不指定，这块会自动的根据 htvp 的包，也就是我们的一个响应头满满类型来判断， ok 吧，好这么一个值，那么有这么一些 值，那么将来啊，我们会学习一种叫做这一份的数据格式，可以在这指定为这一份，当然现在呢，我们可以把它指定为太克斯的纯文本。好纯文本啊，纯文本，比如说指定为 太克斯的好纯文本的格式。现在我没有写这个逗号，注意你看，其实已经报错了，在这个地方他说呀，逗号没有出现，对吧？那么现在呢，会不会报错呢？注意来看，浏览器也会去报这个错误，我们一刷新一加载，然后呢一点击 可以看，点击到之后呢，并没有发出发出任何的一个请求，并且呢在控制台是不是有两个错误啊？给你提示了说有错误，他说啊，嗯，有一个 fun a 的 note 的，反正呢报了一个错误， ok 吧，哪一行呢？你把它确认到哪一行，在这一行 行是不是有一个错误呀？那么这一行有个错，然后呢，这个行错是什么错？等等，其实呢，就是原因就是这个地方没有写逗号，所以呢，这个地方一定要注意，在 分格的时候要加上这么个逗号，但是最后一个键字段我们是不推荐或者说不建议去写这个逗号的， ok， 其实语法规定就是不让写逗号，但是呢，现在这种浏览器啊，他是比较特殊，有些浏览器他会支持，他说你写个逗号我也不给你报错， ok， 对吧？但是呢，我们最后一个建制，对，就不要写逗号了， ok， 然后呢，我们再次刷新一下，好发送，你看现在是不是没有问题啊？好嘞，那么对于这个对他太普呢，后期我们讲了这一份之后，我们回过头来可以再来讲解他，可以设置他的请相应的数据格式为这一份， 方便我们去解析这个数据。好嘞，那么对于第一种刀刃和扎克斯方法来实现这种一步交互，我们就讲解完毕了。
02:11查看AI文稿AI文稿这个是我辅导的同学问的一个问题，怎么样通过浏览器来查看这个阿加克斯接口，他传了什么参数以及返回了什么参数，这应该是每个前端必备的技术知识。这个是他提供的网站，那么我们右键选择最后一个元素，那么我们这里面选择 novo， 那么默认这个地方是哦，对吧？咱们刷新一下访问这个页面，他所有的请求都在这个哦里面，那么这上面有几个标签页，比如说这个，这个是所有大家，可是请求这个是所有的 gscs， 这是图片的，这是视频文件，这是字体的，还有文档的，还有 ws 的，我也不烧给他的， 还有这个 wsm 的注册账号的时候接回了紧急信息，那么我点这个地方，我可以清空所有的接口，那么我点注册，然后我把它切到这个，这个地方啊可以查看 阿亚克斯请求，那么我随便梳一个东西，那我点注册啊，可以看一下，这个是我的接口，这个地方可以选择嗨点这个地方是我接口的名字以及我穿的参数，咱们可以看这个地方， 因为他这个信息是在嗨这里面穿的，他的类型是注册，他的油箱是填的这个，然后还有密码，还有扣的是空的， 你卧槽也是空的，这个是他当前的时间出，我们可以点这个配录的，那这个里面也可以看我发送这个请求， 这是盖的请求，然后他穿的参数，那么他的返回资，咱们可以点这个，这是他的返回资，他返回了三个阶段， datamasitsit， 那么他的这个信息就是邮箱已经存在，那么我们可以写一个邮箱，不存 地址，那么我这地方一定要选这个，你这样的话，他跳转的话，我可以监听到他上一个旅游的日子，我点注册密码小于六位数，那么同样呢，他也会返回这个信息，那么加上 再点注册， ok， ok， 点注册看到没有？那么这个是他会返回注册成功，这个是注册成功的信息，那么他这个其实返回是有问题的，就是他这个接口请求了多笔多次，就是这么看非常的简单。
192大伟聊前端（AI全栈）
02:48查看AI文稿AI文稿这节课来看阿加克斯他的 pose 的请求，来先看网页上的效果，在文本框里输入信息，点击提交按钮，往后台添加一条数据，添加成功以后会弹出提示来看代码。 这里是一个表单，三个文本框，点击提交按钮，调用这个函数，函数里边通过 pose 的请求提交数据。第一个是请求地址，这个请求类型他是 pos 的方法，上节课讲的是 get 方法。 第二是我们要往后台提交的数据，也就是参数是箭，值对的形式，这是箭，这是值，他的值，也就是这里获得到的 这块的对象。有一个 vl 方法，可以获取元素的值，也就是文本框里面我们输入的值， 这是设置返回数据的类型。杰森成功以后的毁掉函数，把它打印出来并弹出来来看效果。提交添加成功与 get 方法的区别 pos 的方法，他的参数是不能写在后边的， 别的方法他的参数可以这样写， 但 pos 的不行。 别的方法一般用来查询数据，添加、修改和删除，一般用 pos 的方法， 如果分的再细一点，添加数据用 pos， 修改数据用 pot， 删除数据用迪丽特，用法是一样的。这里还有需要注意的地方是，这个按钮他的类型应该定义为八寸，如 如果这里不写这个类型的话，在表单里边按钮提交的话，就会按照萨伯蜜的提交，相当于这样， 我们知道 a 是 tmil， 表单里边如果类型是萨波密的，他就直接提交这个表单，这个事件也提交表单，那就相当于提交两次，而这一次提交的时候，他是没有 uir 的，这里面没有写，所以就会刷新页面， 导致的结果就是事件提交一次，他又提交一次，并且把页面给刷新了，所以这个时候他不能不要，也不能写萨波密特，必须写成巴腾。 如果这里面的元素比较多，那么这个地方我们要写很多。这块提供了一个这样的方法，先把这都去掉。 一个虚列化的方法，根据 id 找到这个表单，把表单类的表单元素序列化，序列化的值可作为阿加克斯请求的参数，跟刚才写的效果是一样的。好了，这节课就到这里。
257人人都会软件编程
12:11查看AI文稿AI文稿哈喽，大家好，这个小节的话，我们来演示一下阿贾克斯操作的基本步骤，我们还是以这个案例呢为支撑去往下进行。 我们接下来的话呢，就按照需求往下推进，要点击这个按钮，然后发请求。既然要点击按钮去发请求的话呢，我们现在势必呢就要获取元素，并且给他绑定一个事件， 获取八成元素好 const， 然后 dtn 等一个 document 点 get elements by target name， 把这个八成的放进来，后边需要补一个下标铃。 这第一步啊，第二步的话呢，咱们需要绑定一个事件 btn， 点 onkleek， 我们自己呢借助于盗墓零的方式去搞定好。接下来的话呢，我们先做个测试， control love you test 保存，点开浏览器，刷新页面，点击，点击没有问题，正常的输出。那下边的话，我们就可以呢去进行阿贾克斯操作。 那么阿贾克斯操作这块呢，分为四个步骤，第一步呢是创建对象， x h r 等于一个 new x m l h t t p request， 注意这个名字你可以变化 啊，你可以写 a， 可以写 b， 可以写 abc。 这里为什么选择使用 xhr 呢？是因为它呢是 后边这一个单词首字母的一个缩写，它是三个单词拼接起来的， 这是一个方面啊。另外一方面大家注意，在网络控制台这块有一个 xhr， 他这块呢是对阿贾克斯请求的做一个筛选。所以说以后呢，看到 x hr 之后呢，你要想到是阿贾克斯， 好，这是第一步啊，创建对象。第二步呢是做一个初始化设置请求的方法和这个 url xhr 点这个方法名字叫做 open， 里边呢接收两个参数啊，第一个参数是发送什么类型的请求，第二个参数呢，是给谁发？ 咱们这呢发送一个概率请求，给谁发呢？给他发，给他发。他的 u r l 是什么呢？他的 u r l 是 h t t p 啊，幺二七点零点零点一，冒号八千，然后斜杠来个 surver， 注意前边这块内容不能省略啊，必须要写上，什么时候可以省呢？后边咱们再说，目前这个阶段改一定要写全好，这是第二步，我们下边第三步是做一个发送， 然后 x h r 点儿 sind 啊，然后下边第四步。第四步呢，是做一个事件绑定， 然后这个时间榜的一个作用呢？是处理啊，服务端返回的这个结果啊，返回的结 来绑定一下 x h r r on ready state change 这个事件名称啊，应该是目前为止我们所见过的世界当中最长的一个名字啊。然后呢，这个单词呢，咱们俩需要简单的给大家拆分的讲解一下。 on 这个单词本身有 win 的意思，就是当什么什么的时候，那咱们当时讲了学过的那个 on click 是吧？ on d b l click on mouse over， 就当点击的时候，当双击的时候，当鼠标遗入的时候是 on， 然后另外一个呢，是 ready state， 这个瑞迪 state 啊，他是这个 xhr 对象中的一个属性啊，表示这个状态啊，表示状态啊， 那么他的这个他这个状态呢啊，表示那么这个属性呢？他有五个值，分别是零，一二三四， 零呢表示是未出使化，他最开始这个属性的值就是零，而一呢表示这个 open 方法已经交往完毕。二呢表示是 sen 的方法已经交往完毕。 三呢表示服务端返回了部分的结果，而四呢表示服务端返回了所有的结果。 这是 red state， 这个属性对的一个值，总共有五个，然后下边呢还有一个是 change， change 单词本身是改变的意思，改变呢，咱们之前也接触， 在哪呢？就是在那个下拉框那个元素有一个昂 chinese 事件，就是当改变的时候呢，出发啊，改变的时候有所改变啊，这是改变的意思啊。好了，那么在这的话呢，咱们想一想，这个瑞丽 sty 啊，他总共有五个值， 那么在这呢，他会出发几次呢？他应该会出发四次啊，改一次出发一次，改一次出发一次啊，改一次出发一次，是这么一个效果，有零到一一次，一到二一次，二到三一次，三到四一次，总共呢是四次， 然后在里边呢，我们要处理服务端返回结果，但是要注意啊，我们在状态为零的时候可以处理吗？ 不能，为什么？因为服务端没有返回结果啊，我呢还没法请求呢，一呢可不可以呢？也不行。二呢也不行。三呢 不合适，不能说，三不行，因为三的话已经返回了部分结果了。那么所以说呢，咱们应该在哪？应该在四来去做夫妻返回结果的一个处理，因为当四的时候呢，就是所有结果全部返回， 所以咱们这呢会做一个判断，如果 x h r 点 ready state， 那是等于一个四， 这个呢就表明啊，服务端，服务端返回了所有的结果 啊，返回了所有结果啊，这是状态为私的时候，然后咱们在做处理的时候呢，还会在里边再做一个判断， 判断什么呢？判断这个响应的状态码啊，咱们提过，哎，有二百是吧？有这个四零四啊，有这个四零 零三，有什么四零一，有五百这样的响应状态码，那么什么时候咱们才能够正确的去处拿到啊？正确拿到这个服务端返回的这个结果呢， 就当他为成功的时候，所以说在这咱们还会再去做一个判断，哎，易服 xhr 点 status 老师，哎，等一个多少？等一个两百。 其实在这呢，我们多说一句，响应状态码当中，二开头的都是表示成功， 并非只有两百表示成功啊，二开头的都是表示成功，什么二零一、二零六啊，都是成功。所以说在判断时候呢，我们可以这样来判断，换一种方式，大于等于一个两百，并且呢并 小于个三百，那么只要你这个状态码落在了两百到三百之间，我都认定你是一个成功的。那么成功以后呢，咱们就要处理哎，服务端想要的结果啊，处理这个结果 好了，这是当前的话，咱们做了两个判断啊，一个是判断呢，这个对象他的一个状态是不是到最后一步了，顺便还要判断一下服务端返回的响应状态吗？到底是不是两百到三百之间？ 好了，那如果是怎么办？如果是的话，咱们就处理服务端返回的一个结果， 那么这个结果咱们当时讲过啊，他包括四部分，行头、空行和体。对于空行来说，他并没有 实际的一个意义，对于我们来说，在应用层来说并没有什么实际意义，因为我们想要拿数据 啊，想要拿数据啊，好了，咱们一点一点的对这个行头提里边的结果来做一个获取，并且做一个打印。 首先第一个是响应行，响应行不知道大家记不记得啊？咱点开 hdp 看一下，响应行呢，包括三段， 这个协议版本咱们不需要，咱们需要后边两个东西，状态码和状态字母串。好，来看一下， ctrl 点 log xhr， 点 status， 这个 status 里边保存的就是选银行 里边的啊，所以是响应行里边的响应状态码，状态码好，再 来啃骚，点 log， xhr， 点 status， 泰克斯，这个是什么呢？这个是响应的状态字步串， 状态自助串，然后再来还有 can soldier log， 来个 x h r 点 gets all response headers， 这个是响应头，是所有的响应头 啊，这是服务端返回的啊，所有的响应头在这呢，那么响应体在哪呢？响应体在这呢？ h 点儿 response。 好了，这是这个啊，我们的响应体显著是响应体，现在的话，你想一下，我们就拿到了服务端给我们返回的所有结果行里边包括的状态码 以及状态字母串，响应头以及响应体。阿贾克斯在这块啊，是能够拿到所有的响应。 好了，我们一起来看效果怎么样。点开浏览器刷新页面，把这个卡掉啊，然后点击，然后呢，你看啊，这个请求已经发送成功了，然后点开他，点开他之后呢，咱们看一下这个谁呢？看，先看这吧，先看肯做吧。 看这，这是状态码。状态字母串，这是响应头，这个呢是响应体 啊，这个是响应体。好了，看一看内通外壳里边具体的交换啊，具体的一个啊请求和响应结果。 首先先来看一看这个请求头，点击无忧 soulse 看整个的请求，豹纹啊，这是 起牛航 hos 的主机名啊， ok， 没有问题。然后下来看看这响应头，点开这是这个哎，然后看响应体在这，哈喽，阿加克斯， 所以说现在的话，我们就可以呢拿到这个响应的结果，那么拿到响应结果之后呢，我们有个需求是要把响应体的结果在 div 当中做一个呈现在这，那这个的话也就比较简单了啊，围绕在等一个 dope humans 啊， 点儿 get element 白 id， 把 result 放进来，然后 result 点 inter htm， 把这个去一下， 是设置 result 的文本 result 点 inter h t m l 等于一个谁呢？等于一个 h t m l 等于 x h r 点 response 保存来看下效果怎么样。双击点击就来了， 我们并没有呢，进行页面刷新，就从服务器，然后拿回来最新的一个结果。 好，那么这个小节的话，关于啊价格是请求的一个基本操作，我们就先到这。
437尚硅谷教育
03:30查看AI文稿AI文稿这节课来看一下 js 使用阿加斯与后台交互以及 js 数据格式 啊。加卡的是几个单词的缩写，意思是用 jse 不请求网络，请求网络就可以看到是与后台交互。 我举个例子来说一下阿加斯的使用场景。我们上网时提交信息，点击提交按钮的时候会碰到这两种情况，一种是当我们点击完提交按钮，会跳转页面，跳转到另外一个页面。另一种情况是当我们点击完提交按钮之后，弹出一个框，提示我们操作成功， 页面还是在当前页面没有调转，这种没有调转不刷新页面的情况就是使用了阿加斯是如何请求网络的。来看代码实现，这是一个按钮，点击按钮就要用这个函数获取数据， 写下 x， 只要依靠这个对象先溜出一个对象，因为是一步操作，所以有毁掉函数，当出发这个事件的时候就掉下边的函数， 这个对象通过 open 方法来设置连接服务器。第一个参数是请求方法的类型，这里用的 get 方法。第二个参数是请求的 uil 地址，他是后台提供的接口地址，这个是我本地启动的一个家务项目， 在你那里是访问不到的，你没法测试。第三个参数表示是同步还是一步，默认就是一步的数，表示一步， 然后是发送请求，获得数据以后是在回调函数里边处理的。在这个对象事件的回调函数里边，意思表示的是这个对象，这个对象有几个状态，当这个状态改变的时候就会触发这一 事件，他的状态等于四的时候，表示相应一定完全接收，这个属性是服务器范围的 http 状态码等于两百的时候表示成功，这时候就可以拿到相应的文本了，也就是后台范围的数据， 我们把它打印出来看是什么数据来看效果， 获取数据，打印出来是这一个字幅串，这就是 jsen 格式的数据。 看过前面视频的可能会说，这不是一个对象吗？他跟对象的格式是一样的，不同的是杰森他的剑必须是双引号引住， 并且他整体是一个自负串，是无法用对象名点内幕获取到这个值的，但是我们可以把这段自负串 转成对象。在 js 中内置了 j 三解析，可以这样把支付串转为对象 来看答案，结果 这就成了一个对象，看到他们两个区别了没， 他是有属性的，来把这些数据显示在页面上， 加几个标题标签，操作盗墓。把数据展示在网页上，他已经是一个兑现了，所以通过点可以获取到他的属性值，分别把这些值付给这些元素来看效果， 获取数据就这样展示出来了，这就是阿加克斯，因为他涉及到了与后台交互， 所以有一些概念需要等到我们讲完加了后台的时候才能更好的理解。好了，这节课就到这里。
252人人都会软件编程
01:09
05:16查看AI文稿AI文稿欢迎收看本期视频，本期学习 a j x 的工作原理和请求的五个步骤。首先我们来回顾下 a j x 是什么？ a j x g a c g r s x m l 是指一种创建交互式快速动态网页应用的网页开发技术，无需重新加在整个网页的情况下能够更新部分网页的技术。 通过在后台与服务器进行少量数据交换， ajx 可以使网页实现一步更新。这意味着可以在不重新加载整个网页的情况下对网页的某部分进行更新。 ags 是一种用于创建快速动态网， 通过在后台与服务器进行少量数据交换， agx 可以使网页实现义不更新。 这意味着可以在不重新加载整个网页的情况下对网页的某部分进行更新。传统的网页不使用 ags， 如果需要更新内容， 必须从在整个网页面前面谈到。 ajx 是什么？其主要也就是一步提交。大家是否知道同步和一步提交的区别吗？同步提交，当用户发送请求时， 当前页面不可以使用服务器响应，页面到客户端响应完成，用户才可以使用页面 交。当用户发送请求时，当前页面还可以继续使用。当一部请求的数据响应给页面页面把数据显示出来。 ags 的工作原理 a g x 的工作原理相当于在用户和服务器之间加了各中间层。 a g x 型使用户操作与服务器响应异步化。 并不是所有的用户请求都提交给服务器，像些数据验证和数据处理等都交给 ajx 引擎自己来做，只有确定需要从服务器读取新数据时，再由 ajx 引擎代为向服务器提交请求。 客户端发送请求，请求交给 x h 二 x h 二把请求提交给服务，服务器进行业务处 福利，服务器响应数据交给 x h r 对象。 x h r 对象接收数据，由 g s r s r 把数据写到页面上，如下图所示， agx 请求实力代码后台方法 总结 a g x 请求的五个步骤，一、建立 x m l h t t p l e q u e s c 对象 一般我们手写 ajx 的时候，首先要判断该浏览器是否支持 x m l h t t p r exc 对象，如果支持则创建该对象，如果不支持，则创建 x y x 对象。二、设置回调函数三、使用藕粉方法与服务器建立链接。四、向服务器发送数据。 五、在回调函数中针对不同的响应状态进行处理。应用场景在创建 wf 站点时， 在客户端执行屏幕更新，为用户提供了很大的灵活性。下面是使用 ats 可以完成的功能， 动态更新购物车的物品总数，无需用户单机 app， 并等待服务器重新发送整个页面，提升站点的性能。这是通过减少从服务器下载的数据量而实现的。例如，在 m 三的购物车页面，当更新篮子中的一项物品的数量时，会重新载入整个页面，这必须下载三十二 k 的数据。如果使用 ajx 计算新的总量，服务器只会返回新的总量值， 因此所需的代宽仅为原来的百分之一，消除了每次用户输入时的页面刷新。例如，在 agx 中，如果用户在分页列表上单击 nice， 则服务器数据只刷新列表，而不是整个页面 直接编辑表格数据，而不是要求用户导航到新的页面来编辑数据。对于 a 值 x， 当用户单击 x 时，可以将静态表格刷新为内容可编辑的表格。用户单击的 之后就可以发出一个 ajx 请求来更新服务器并刷新表格，使其包含静态只读的数据。谢谢收看本期视频，喜欢请关注哦！
208程序员媛博
