一. Ajax 基础
1. 异步传输 +js+xml
优点:无需刷新整个页面,就能更新局部数据的技术
缺点:打破了浏览器的 back 回退机制
2. 同异步
异步:当一行代码还没结束,就可以执行另一行代码
同步:当一行执行结束,才能执行另一行代码
3. 连接步骤
- 创建
XMLHttpRequest
请求对象 - 发起 open 请求,需指定 http 的请求方式、请求地址
- 向服务器发送数据
- 监听服务器的响应和状态码
- 判断是否连接成功执行的函数
4. 解决同源跨域问题
同源(三源):协议、域名、端口号
dataType:"jsonp"
,<script>
的 src 不受同源策略的影响
java:@CrossOrigin
5. readyState 状态码
0, 请求未初始化
1, 服务器已建立链接
2, 请求已接受
3, 请求处理中
4, 请求完成并且响应就绪
6. 两种 http(TCP)发送请求方式:get 和 post 区别
- 请求的内容和作用不一样
get 是请求指定的页面信息,并返回实体主体。
post 在指定资源提交数据进行处理**(提交表单、上传文件)**,数据是包含在请求体中的。 - 请求的参数直接在浏览器 地址栏中显示
get 会:参数是通过 url 传递
post 不会:参数是通过 Request body - 发送次数不一样
get 会产生一个数据包:浏览器会先 http header 和 data 一起发送出去,服务器响应 200(返回数据)
post 会产生两个数据包(2 次):两次发包的优点,可以保证数据的完整性
浏览器会先发送 header,服务器响应 100(临时请求) continue,在发送 data,服务器响应 200(返回数据)。 - 存储的容量不一样
get 存储的参数不能超过 2k
post 没有限制
7. js 和 jq ajax 的码法
-
js
-
jquery
<script> $(function () { $.ajax({ // 请求地址 url: "js/mydata.json", // 请求方式 type: "get", // 是否为异步,true为异步,false为同步 async: "true", // 向服务器端传送数据 data: {}, // 请求成功返回的函数 success: function (res) { console.log(res); //jq的遍历方式 $.each(res, function (k, v) { console.log(k, v); $(".box").append(" <p>\n" + " <span>" + k + "</span>\n" + " <span>" + v + "</span>\n" + " </p>") }) }, // 请求失败返回的函数 error: function (res) { console.log(res); } }) }) </script>
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于