AJAX的知识汇总

梦里梦外; 2023-10-02 21:41 16阅读 0赞

## 1.首先要明白，你什么情况下会考虑使用AJAX。 ##

**AJAX是实现局部刷新的一种实现方式。**

局部刷新：给人的感觉是，你在浏览器页面的某个位置点击之后，整个页面只有你点击的那部分的内容，会发生变化，而其他的页面保持不变，这样就减少了请求。

全局刷新：即无论你点击浏览器页面的那个地方，他都会全部重新加载该页面。

--------------------

## 2.那么是如何设计局部刷新呢？ ##

在技术发展的过程中，当然是觉得全局刷新有一定的缺陷，我们才设计出来了局部刷新这种技术。

实现局部刷新使用的是浏览器内存中的一个对象，XMLHttpRequest,这个对象是在<script>标签里面创建的，他的名字叫做，异步对象。

AJAX中包含的技术：dom，JavaScript，Css，xml。

可以说是：**AJAX不是一种新的语言，只是一种技术的整合。**

那么我们如何去使用AJAX呢？？？

我们可以在html，jsp，页面中的<script>中定义函数。

下面将给出AJAX的使用案例：

![8a2ac01c6a614300ac3b1d65165a16f6.jpeg][]

**对上面的步骤进行总结：**

*  创建异步对象XMLHttpRequest
 *  给异步对象绑定onreadystatechange事件
 *  确定请求地址，请求方式
 *  发送请求

关于XMLHttpRequest对象的属性的解释

![52925c2f99d046f197838ad69982bb39.jpeg][]

**注意：**异步对象发送的请求，那么响应的结果就会交给异步对象

***我们在浏览器，可以按F12看到xhr，这个xhr就是我们的XMLHttpRequest***

--------------------

--------------------

## 3.封装JSON ##

用上面的方式发起的请求，后端给我们返回的结果是一个字符串，我们处理起来很麻烦，因此我们有必要，将后端给我们返回的数据进行封装，将其封装成一个JSON，更方便我们处理。

**JSON的格式：\{‘key’：‘value’，‘key’：‘vaule’\}**

上面的key必须是用‘’引起来，而value若是数字，则可以不用‘’

那么如何将后台返回的数据封装成一个JSON呢？？？

我们使用的是JackSon中的ObjectMapper类，将java对象写作JSON类型的字符串，然后再返回给前端。

![29cf1a5fd99a42ca85b5aa9ff34b832a.jpeg][]

--------------------

--------------------

以上的这都是我从我自己的笔记中截的图。正在慢慢将笔记上的转移到网上。

大家一起加油！！！！！！

[8a2ac01c6a614300ac3b1d65165a16f6.jpeg]: https://img-blog.csdnimg.cn/8a2ac01c6a614300ac3b1d65165a16f6.jpeg
[52925c2f99d046f197838ad69982bb39.jpeg]: https://img-blog.csdnimg.cn/52925c2f99d046f197838ad69982bb39.jpeg
[29cf1a5fd99a42ca85b5aa9ff34b832a.jpeg]: https://img-blog.csdnimg.cn/29cf1a5fd99a42ca85b5aa9ff34b832a.jpeg

发表评论取消回复

表情：

评论列表（有 0 条评论，16人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery的知识汇总

1.什么是jQuery? jQuery是JavaScript库，也即jQuery中是封装了很多的javaScript语句，函数。相当于Java的工具类，其也是一款跨主流浏

桃扇骨/ 2023年10月02日 21:41/ 0 赞/ 25 阅读

相关 AJAX的知识汇总

1.首先要明白，你什么情况下会考虑使用AJAX。 AJAX是实现局部刷新的一种实现方式。局部刷新：给人的感觉是，你在浏览器页面的某个位置点击之后，整个页面只有你点击的

梦里梦外;/ 2023年10月02日 21:41/ 0 赞/ 17 阅读

相关 AJAX技术汇总

AJAX AJAX全称为“Asynchronous JavaScript and XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。它

迷南。/ 2022年09月18日 04:49/ 0 赞/ 277 阅读

相关前端知识汇总

[前端知识汇总http://html5ify.com/fks/][http_html5ify.com_fks] [http_html5ify.com_fks]: http:

分手后的思念是犯贱/ 2022年07月17日 00:52/ 0 赞/ 301 阅读

相关 ajax知识总结

1. 使用XMLHttpRequest获取数据：open()和send() open(method,url,anync) meth

梦里梦外;/ 2022年06月15日 12:21/ 0 赞/ 289 阅读

相关 Ajax基础知识

<table> <tbody> <tr> <td><b>目录</b></td> </tr> </tbody> </table> 1.Ajax基础

比眉伴天荒/ 2022年06月05日 03:58/ 0 赞/ 251 阅读

相关 JVM知识汇总

一、JVM 基础知识 1）Java 是如何实现跨平台的？注意：跨平台的是 Java 程序，而不是 JVM。JVM 是用 C/C++ 开发的，是

r囧r小猫/ 2022年05月23日 00:19/ 0 赞/ 344 阅读

相关常见的Ajax写法汇总

title: Ajax写法 date: 2018-06-30 11:01:47 tags: Ajax写法作者:李忠林 Github: [https

拼搏现实的明天。/ 2022年05月21日 05:04/ 0 赞/ 214 阅读

相关 ajax基础知识

$.ajax() 方法常见参数属性 $.ajax({ url: ..., method: ..., contentType: ...

清疚/ 2021年09月17日 03:32/ 0 赞/ 413 阅读

相关 ajax基础知识

$.ajax() 方法常见参数属性 $.ajax({ url: ..., method: ..., contentType: ...

痛定思痛。/ 2021年09月17日 03:30/ 0 赞/ 446 阅读