AJAX学习笔记

最新推荐文章于 2025-12-29 12:55:34 发布

原创最新推荐文章于 2025-12-29 12:55:34 发布 · 114 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #学习 #javascript

文章详细介绍了AJAX实现局部刷新的技术原理，包括XMLHttpRequest对象的readyState属性和HTTP状态码，以及如何进行GET和POST请求。同时，提到了JSON字符串与JavaScript对象之间的转换方法，并强调了在使用AJAX时的注意事项，如DOM与jQuery对象的转换。最后，讨论了AJAX在省市联动等实际场景中的应用。

AJAX异步请求

局部刷新。
ajax返回的有可能是普通文本，XML字符串，JSON字符串
XMLHttpRequest对象的readyState属性对应的状态值：
- 0：请求未初始化
- 1：服务器连接已建立
- 2：请求已收到
- 3：正在处理请求
- 4：请求已完成且响应已就绪
Http常见状态码(status)：
- 200表示成功了，404表示资源找不到，500代表服务器内部错误。
XMLHttpRequest对象：
- readyState是ajax响应的状态。(xhr(this).readyState)
- status是Http响应的状态码。(xhr(this).status)
ajax如何提交get请求数据呢：
- url?key=value&key=value…
提交post请求如何做？
- xhr.send()在括号中填写，格式：key=value&key=value&key=value…
- （重要）在提交前还需要：（固定写法）模拟提交表单
```
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded")
```
  - 注意：这段代码要放在xhr.open()之后，xhr.send()之前，通道必须打开才能设置请求头

ajax中转换字符串为json对象的两种方法

使用eval函数

var fromJava = "var user = {\"username\" : \"zhangsan\",\"password\" : \"123456\"}"
        eval(fromJava)

var obj = JSON.parse("{\"username\" : \"zhangsan\",\"password\" : \"123456\"}")
console.log(obj.username)

使用JSON.parse函数

后端返回json格式的数据：

手动拼接：将json格式的数据分割开来，从数据库获取到数据后拼接到json字符串中。

//[{"id" : "1","name":"李","age":"20"},{"id" : "2","name":"w","age":"10"}]
                /*sb.append("{\"id\" : \"");
                sb.append(id);
                sb.append("\",\"name\":\"");
                sb.append(name);
                sb.append("\",\"age\":\"");
                sb.append(age);
                sb.append("\"},");

使用FastJson：导入jar包，引入依赖后，使用JSON类直接调用里面的静态方法
- ```
str = JSON.toJSONString(stuList);
```
- 可以传入javabean对象，集合等

ajax注意事项

使用

$("#id") 选择的元素,如果使用this，这个this对象不是jquery对象，而是html中元素的对象，所以this对象不能使用jquery对象的方法，但是可以直接使用自己的属性，如this.value this.innerHTML等等。

ajax省市联动

1。画出html页面
2。设计数据库表
3。完成前端ajax设计与请求发送 fvff
4。后端处理并返回。

jQuery

dom对象和jQuery对象

dom对象转jQuery对象:
- $("#xx") #id选择器
- $(".xx") .类选择器
- $("xx")根据名字选择
- $("#id,.class,xx")组合选择器
jQuery对象转dom对象
- jQuery对象本质上是一个数组，因此可以jQuery[0]或者jQuery.get(0)的方法来转换成dom对象