AJAX学习笔记

最新推荐文章于 2024-09-20 13:39:31 发布
最新推荐文章于 2024-09-20 13:39:31 发布
阅读量399 收藏
点赞数
文章标签： ajax 学习 javascript java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_46625488/article/details/129470321
版权

文章目录

一、目前浏览器和服务器交互的请求发送方式

1、浏览器和服务器进行数据交互的请求发送方式

  • 浏览器发送HTTP格式请求
  • 服务器接受请求，并完成请求的解析 —request和response方法
  • 服务器根据请求的解析结果调用对应的资源出口请求
  • 服务器将处理结果响应给浏览器
  • 浏览器接受响应结果并完成解析
  • 浏览器将解析后的响应结果在网页中显示给用户

2、目前触发浏览器发起请求的方式（三种）

  • 使用form表单
  • 使用超链接（相当于from表单的get请求）
  • 在js代码中使用window.location.href（相当于from表单的get请求）

   这三种触发的请求，被浏览器接收到响应结果后，会在当前页面将原有的内容覆盖，只显示最新的响应结果。而请求的响应结果如何被展现，是浏览器的行为，因为响应结果由浏览器负责解析展现，跟后台服务器没有关系！后台服务器只负责请求的处理，以及处理结果的响应。
   注意：
在浏览器段生命的处理响应结果的逻辑代码用Js语言完成，而且是在新的请求发送之前就已经将响应结果处理的逻辑代码给浏览器。需要提前给浏览器的内容：

  • 页面资源
  • 新方式（Ajax）的请求的逻辑代码
  • 新方式（Ajax）的响应结果的处理逻辑代码

二、Ajax的基本概念

概念 :AJAX(Asynchronous JavaScript And XML):是由浏览器解析运行的JavaScript实现的网页局部刷新技术

Ajax作用：实现在当前网页中显示新的响应内容。
Ajax的特点：

  1. 一种新的让浏览器发起HTTP请求的技术
  2. 浏览器使用Ajax技术发起请求，响应结果不会自主显示而是按照预先声明的响应结果处理逻辑来显示响应内容，并且是在当前页面显示。
  3. Ajax是一门基于JavaScript的技术，由浏览器解析运行，和服务器没有关系
  4. 浏览器段的响应结果处理代码是提前给浏览器提供的
  5. 简单易用

三、Ajax的状态码

在ajax对象中提供了一个监听机制，“onreadystatechange”，用来监听ajax的属性readystate的改变情况，一旦值改变，就会触发监听的函数执行。

readystate的含义：

  • 0：请求没有发出（在调用open（）之前）
  • 1：请求已经建立但是还没有发出（调用send（）之前）
  • 2：请求已经发出正在处理之中（在这里通常可以从响应的到内容头部）
  • 3：请求已经处理，响应中有数据可用，但是服务器还没有完全响应（开始接收响应，但是没有接受完全）
  • 4：响应已经完成，浏览器已经接收到全部的响应内容

四、Ajax的响应状态码

在Ajax对象中，其中status属性是用来记录响应结果的状态码的
解决主要问题：判断响应结果的正确性

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>ajax_demo01</title>
    <%--   引入jquery文件   --%>
    <script src="../../statics/js/jquery.js"></script>


    <%--    声明ajax代码域    --%>
    <script type="text/javascript">
        // 给按钮添加单击事件
        $(function () {
            $("#btn").click(function () {
                //发送ajax请求
                    //创建ajax对象
                var ajax=new XMLHttpRequest();
                    //创建请求方式以及请求地址
                ajax.open("get","http://localhost:80/ajaxServlet");
                ajax.send();
                ajax.onreadystatechange=function () {//回调函数
                    if (ajax.readystate==4){
                        //给ajax对象增加一个监听，监听readystate值的变化
                        //一旦变更，则触发监听函数的执行，当readytate的值为4的时候表示响应结果成功接受
                        //浏览器接受到ajax的响应结果后，不会直接执行，而是会讲响应结果赋值给Ajax对象的responseText属性
                        if (ajax.status==200){
                            //获取响应结果
                            var result=ajax.responseText;
                            console.log(result);
                            //讲结果纯粹的显示在当前页面
                            $("#test").html(result);//test是一个div的id值

                        }else if (ajax.status==404){
                            $("#test").html("资源未找到");
                        }else if (ajax.status==500){
                            $("#test").html("服务器繁忙");
                        }else {
                            $("#test").html("未知");
                        }
                }
                }
                //非ajax的处理代码
                   console.log("其他处理代码！！！");
            })
        })
    </script>
</head>
<body>
    <h1>ajax使用案例01</h1>
    <%--   1. 测试ajax    --%>
    <input type="button" id="btn" value="测试Ajax">
<br><br/>
    <div id="test" style="width: 500px;height: 600px;background-color: #00f7de"> </div>
</body>
</html>

五、Ajax的异步和同步

解决问题：非ajax的处理代码的执行顺序是在响应结果结束之后执行，还是按照正常的顺序执行。
从而引入了ajax的同步和异步
ajax同时支持同步和异步设置，默认是异步的操作。
ajax同步和异步的使用：ajax.open方法的async参数的值。true表示同步，false表示异步。

  1. ajax的同步
    Ajax代码执行后需要等待响应结果，并且触发回调函数的执行，等待回调函数执行完毕后，继续执行其它逻辑代码。
ajax.open("get","http://localhost:80/ajaxServlet",false);
  1. ajax的异步（默认是异步的）

Ajax代码执行后正常执行其它逻辑代码，不需要等待响应结果的处理。

ajax.open(“get”,“http://localhost:80/ajaxServlet”);

六、Ajax的get请求和post请求

GET和POST请求如何设置以携带请求数据呢？

直接在Ajax.open方法中设置请求方式即可，

  • 如果是GET方式直接在URL地址上拼接请求数据即可；
          //创建请求方式以及请求地址--GET
         ajax.open("get","http://localhost:80/ajaxServlet?username=张三&password=111111");
         ajax.send(null);
  • 如果是POST请求，需要在Ajax.send方法中声明请求数据，并且还需要设置请求头中的请求数据的类型。
		 //在open方法中设置post的请求方式
		ajax.open("post","http://localhost:80/ajaxServlet",true);
		//设置请求头的请求数据类型application/x-www-form-urlencode(键值对的形式)
		ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded")
		//发送请求，如果没有请求数据就设置未null
		ajax.send("username=&password=111111");

七、Ajax的响应格式

1、Ajax的响应模式

          首先，是请求页面，随着页面的响应讲Ajax的代码一并响应给浏览器。那么当用户触发了该页面的Ajax请求后，服务器处理请求后响应的内容就无需再次拼接页面代码了，也就是说服务器后台请求的逻辑代码无需再请求转发或者重定向,而是直接向响应结果给了浏览器即可，然后让浏览器出发回调函数完成响应结果的展示即可。

2、响应简单数据

          如果后台处理的结果比较简单，例如：简单的字符串，后台可以直接利用response对象的方法直接打印给前台。

3、响应复杂数据

例如：List user对象

          当请求一个Java对象时，我们无法将Java对象直接响应给浏览器，真正需要响应的数据是Java对象中存储的数据。那么我们就需要将数据从java对象中取出后转为字符串打印给浏览器，但是这样取出的数据如何拼接为一个合理的字符串就成了问题。一般情况下，拼接合理的字符串需要满足如下两个条件：

  • 在后台请求的逻辑中比较方便将一个java对象中的数据转换为字符串数据
  • 在浏览器接收到字符串响应数据后要容易对数据进行解析处理

总之，我们需要一个后台服务器和浏览器之间响应数据交互的格式（浏览器好识别，服务器号拼接）
实现：使用JSON字符串格式

八、Java对象转为Json对象的使用

json多用于数据存储、交换与传输，json相比于xml更小，更快，更容易解析

1、Java对象和Json之间的转换

#java
Person p = new Person();
p.setName("张三");
p.setAge(23);
p.setGander("男");

#javascript
var p = {
	"name":"张三",
	"age":"23",
	"gender":"男"
};
#Map集合存储基本类型数据对应的Json格式：
HashMap hm-new HashMap();
hm.put("a1","哈哈");
hm.put("a2","嘿嘿");
"{a1:'哈哈',a2:'嘿嘿'}"
#List集合类型并存储引用类型数据的Json格式：List存储两个User对象
"[
	{id:'1',uanme:'zs',pwd:'123'},
	{id:'2',uanme:'lisi',pwd:'123'}	
]"

浏览器获得响应结果和处理：
        注意：类型为字符串的类型
        获取响应数据
                var 变量名=ajax.response.Text
          第一点：普通字符串的处理直接使用
          第二点：Json格式的字符串处理，使用eval函数将Json数据转换为js对象

注意（后台对象转为json格式）：如果是简单的数据，直接使用resp.getWrite.write()响应即可，如果是复杂的数据需要我们转换为Json格式，但是手动转换太麻烦，所以一帮我们直接用第三方的工具包，也就是需要导入想改依赖

    <!-- https://mvnrepository.com/artifact/com.google.code.gson/gson -->
<dependency>
    <groupId>com.google.code.gson</groupId>
    <artifactId>gson</artifactId>
    <version>2.8.5</version>
</dependency>

java代码案例
前端

@Test
    public void test4(){
        TestUser user1=new TestUser(1,"radan","123");
        TestUser user2=new TestUser(2,"yjr","123");
        List<TestUser> testUsers=new ArrayList<>();
        testUsers.add(user1);
        testUsers.add(user2);
        System.out.println(testUsers);
        //将java对象转换为Json字符串响应
        String data=new Gson().toJson(testUsers);
        System.out.println(data);
        /*
        输出：[{"id":1,"username":"radan","password":"123"},{"id":2,"username":"yjr","password":"123"}]
         */
    }

后台

 <script src="../../statics/js/jquery.js"></script>
    <%--    声明ajax代码域    --%>
    <script type="text/javascript">
        // 给按钮添加单击事件
        $(function () {
            $("#btn").click(function () {
                //发送ajax请求
                    //创建ajax对象
                var ajax=new XMLHttpRequest();
                    //创建请求方式以及请求地址
                //在open方法中设置post的请求方式
                ajax.open("post","http://localhost:80/ajaxServlet",true);
                //设置请求头的请求数据类型application/x-www-form-urlencode(键值对的形式)
                ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded")
                //发送请求，如果没有请求数据就设置未null
                ajax.send("username=zs&password=111111");
                ajax.onreadystatechange=function () {
                    if (ajax.readyState==4){
                        //给ajax对象增加一个监听，监听readystate值的变化
                        //一旦变更，则触发监听函数的执行，当readystate的值为4的时候表示响应结果成功接受
                        //浏览器接受到ajax的响应结果后，不会直接执行，而是会讲响应结果赋值给Ajax对象的responseText属性
                        if (ajax.status==200){
                            //获取响应结果--前端传入的Json字符串数据
                            var result=ajax.responseText;
                            //将响应的Json格式的字符串数据转换为js对象--因为没有在Json的字符串没有变量名指向，因此加一个var obj=字符串给原有的Json数据
                            eval("var obj="+result);
                            console.log(obj);
                            //讲结果纯粹的显示在当前页面
                            $("#test").html("username="+obj.username);//test是一个div的id值
                        }else if (ajax.status==404){
                            $("#test").html("资源未找到");
                        }else if (ajax.status==500){
                            $("#test").html("服务器繁忙");
                        }else {
                            $("#test").html("未知");
                        }
                }
                }
                //其他处理逻辑
                console.log("其他处理代码！！！");
            })
        })
    </script>

2、Json的基本样式

Json的数据存储在键值对中，键用单引号或者双引号引起来，也可以不用引号，值的类型可以是数字、字符串、布尔值、数组、对象或者null。

json1:
#键值对
{
	"name":"张三"，
	"sex":"male",
	"age":18,
	"area":"北京"
}
json2:
#数组作为value
{
	"data":[
		{
			"name":"李四",
			"sex":"female",
			"age":19,
			"area":"上海"
		},
		{
			"name":"王五",
			"sex":"male",
			"age":22,
			"area":深圳
		}
	]
	"dep":"开发中心"，
	"code":105
}
json3:
#数组作为json对象
[
	{
		"name":"张三",
		"sex":"male",
		"age":18,
		"area":"北京"
	},
	{
		"name":"李四",
		"sex":"female",
		"age":19,
		"area":"上海"
	}
]

通过json对象.键名、json对象[“键名”]、数组对象[索引]来获取json中存储的数据。

九、Jquery对Ajax的封装

不难发现，当我们在jsp页面声明Ajax代码时，Ajax代码的流程是死的，而且代码的声明是冗余的，真正想写的代码是Ajax请求地址，请求数据以及回调函数的逻辑，那么能不能考虑将Ajax的代码进行封装。

封装：换言之，就是相同的保留，不同的传参。我们可以声明一个函数，此参数的底层为Ajax的执行流程代码，并对外暴露形参。形参为请求方式、请求地址，以及回调函数。（回调函数的形参就是用来接受响应数据的）
实现：Jquery已经将Ajax完成了封装，我们可以使用Jquery提供的Ajax封装来完成Ajax功能

三种方式内容：
回调函数的xin

  • $.get(“请求url地址”,“请求的数据”，回调函数)
  • $.post(“请求url地址”,“请求的数据”，回调函数)
  • $.ajax(键值对的参数设置)，API

1、Jquery的get方式的ajax封装

$.get(“请求url地址”,“请求的数据”，回调函数)

前端

 <script src="../../statics/js/jquery.js"></script>
    <%--   声明js的代码域 --%>
    <script type="text/javascript">
        /************1.jquery的Get方式对Ajax的封装*************/
        $(function () {
            $("#btn1").click(function () {
                //发送get方式的Ajax请求--$.get("请求url地址","请求的数据"，回调函数)
                //请求数据即支持Json格式的字符串，也可以是普通格式的字符串
                //回调函数的形参就是用来接受响应数据的--data等价于var result=ajax.responseText;
                $.get("http://localhost:80/ajaxServletGet","username=zs&password=456",function (data) {//此时，对于原生Ajax的判断状态码等，就不需要了
                    //将响应的Json格式的字符串数据转换为js对象--因为没有在Json的字符串没有变量名指向，因此加一个var obj=字符串给原有的Json数据
                    eval("var obj="+data);
                    console.log(obj);//控制台输出一下
                    //讲结果纯粹的显示在当前页面
                    $("#test").html("username="+obj.username);//test是一个div的id值
                })
            })
        })
    </script>

后端

 @GetMapping("/ajaxServletGet")

    protected void ajaxServletGet(HttpServletRequest req, HttpServletResponse resp) throws IOException {
        //1. 设置编码格式
        req.setCharacterEncoding("utf-8");
        resp.setCharacterEncoding("utf-8");
        resp.setContentType("text/html;charset=utf-8");
        String username= req.getParameter("username");
        String password=req.getParameter("password");
        //2. 获取请求信息
        //3. 处理请求
        System.out.println("ajax请求处理完毕");
        System.out.println("username="+username);
        System.out.println("password="+password);
        //创建一个TestUser对象。传入后台
        TestUser user=new TestUser(1,"radan","123");
        //4.响应结果
        //将user对象转为Json格式的字符串--在响应
        String data= new Gson().toJson(user);
        System.out.println("将user对象转为Json格式的字符串为"+data);
        //输出： 将user对象转为Json格式的字符串为{"id":1,"username":"radan","password":"123"}
        resp.getWriter().write(data);

    }

2、Jquery的post方式的ajax封装

$.post(“请求url地址”,“请求的数据”，回调函数)

前端

	<%--   引入jquery文件   --%>
    <script src="../../statics/js/jquery.js"></script>
    <%--   声明js的代码域 --%>
	<script type="text/javascript">
	        /************2.jquery的Post方式对Ajax的封装*************/
	        $(function () {
	            $("#btn2").click(function () {
	                //发送post方式的Ajax请求--$.post("请求url地址","请求的数据"，回调函数)
	                $.post("http://localhost:80/ajaxServlet",{username:"zs",password:"456789"},function (data) {
	                    //此时，对于原生Ajax的判断状态码等等代码，就不需要了
	                    //将响应的Json格式的字符串数据转换为js对象--因为没有在Json的字符串没有变量名指向，因此加一个var obj=字符串给原有的Json数据
	                    eval("var obj="+data);
	                    console.log(obj);//控制台输出一下
	                    //讲结果纯粹的显示在当前页面
	                    $("#test").html("username="+obj.username);//test是一个div的id值
	                })
	            })
	        })
	 </script>

后端

@PostMapping("/ajaxServlet")

    protected void ajaxServlet(HttpServletRequest req, HttpServletResponse resp) throws IOException {
        //1. 设置编码格式
        req.setCharacterEncoding("utf-8");
        resp.setCharacterEncoding("utf-8");
        resp.setContentType("text/html;charset=utf-8");
        String username= req.getParameter("username");
        String password=req.getParameter("password");
        //2. 获取请求信息
        //3. 处理请求
        System.out.println("ajax请求处理完毕");
        System.out.println("username="+username);
        System.out.println("password="+password);
            //创建一个TestUser对象。传入后台
        TestUser user=new TestUser(1,"radan","123");
        //4.响应结果
             //将user对象转为Json格式的字符串--在响应
        String data= new Gson().toJson(user);
        System.out.println("将user对象转为Json格式的字符串为"+data);
            //输出： 将user对象转为Json格式的字符串为{"id":1,"username":"radan","password":"123"}
        resp.getWriter().write(data);

    }

3、Jquery的ajax方式的ajax封装

$.ajax(键值对的参数设置)，参考API

前端

	<%--   引入jquery文件   --%>
    <script src="../../statics/js/jquery.js"></script>
    <%--   声明js的代码域 --%>
	 <script type="text/javascript">
        // 给按钮添加单击事件
       $(function (){
           $("#btn3").click(function (){
               $.ajax({
                   type:"post",
                   url:"http://localhost:80/ajaxServlet",//默认是当前页面值
                   data:"username=lisi&password=123456789",
                   success:function (data) {
                       //将响应的Json格式的字符串数据转换为js对象
                       eval("var obj="+data);
                       console.log(obj);//控制台输出一下
                       //讲结果纯粹的显示在当前页面
                       $("#test").html("username="+obj.username);//test是一个div的id值
                   }
               })
           })
       })

后端

@PostMapping("/ajaxServlet")

    protected void ajaxServlet(HttpServletRequest req, HttpServletResponse resp) throws IOException {
        //1. 设置编码格式
        req.setCharacterEncoding("utf-8");
        resp.setCharacterEncoding("utf-8");
        resp.setContentType("text/html;charset=utf-8");
        String username= req.getParameter("username");
        String password=req.getParameter("password");
        //2. 获取请求信息
        //3. 处理请求
        System.out.println("ajax请求处理完毕");
        System.out.println("username="+username);
        System.out.println("password="+password);
            //创建一个TestUser对象。传入后台
        TestUser user=new TestUser(1,"radan","123");
        //4.响应结果
             //将user对象转为Json格式的字符串--在响应
        String data= new Gson().toJson(user);
        System.out.println("将user对象转为Json格式的字符串为"+data);
            //输出： 将user对象转为Json格式的字符串为{"id":1,"username":"radan","password":"123"}
        resp.getWriter().write(data);

    }

十、Ajax的使用

  1. 创建Ajax请求的逻辑代码，并提供给浏览器让用户触发

  2. 创建Ajax请求结果的响应处理逻辑代码，提前交给浏览器
    注意：我们只是提供逻辑代码，由浏览器执行。在某个请求的响应结果中提供给浏览器使用。

  3. 与服务器进行数据交换:通过AJAX可以给服务器发送请求，并获取服务器响应的数据
    使用了AJAX和服务器进行通信，就可以使用HTML+AJAX来替换JSP页面了
    在这里插入图片描述

  4. 异步交互:可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术，如:搜索联想、用户名是否可用校验，等等.(局部更新)
    在这里插入图片描述

<script >
      //1.创建XMLHttpRequest核心对象
      var xhttp;
      if (window.XMLHttpRequest) {
        xhttp = new XMLHttpRequest();
      } else {
        // code for IE6, IE5
        xhttp = new ActiveXObject("Microsoft.XMLHTTP");
      }
      //2.发送请求
      xhttp.open("GET", "http://localhost/AjaxServlet");//路径是全路jing:http://localhost//AjaxServlet
      xhttp.send();
      //3.获取响应数据

        xhttp.onreadystatechange = function() {
          if (this.readyState == 4 && this.status == 200) {

                    alert(this.responseText);
          }
        };

</script>

在这里插入图片描述
ajax异步请求验证用户名已存在

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>b</title>
</head>
<body>
<form action="/demo4" method="post">
    用户名：<input id="username" type="text" name="username"/>
    <br/>
    <span style="display: none;color: red"  id="username_error">用户名已存在</span>
    密码：<input name="password"/><br>
    <input type="submit" >
</form>
<script>
    //1.给用户名输入框绑定一个失去焦点的对象
    document.getElementById("username").onblur=function () {
        //2.发送ajax请求
        //获取用户名的值
        var username1=this.value;
        //1.创建XMLHttpRequest核心对象
        var xhttp;
        if (window.XMLHttpRequest) {
            xhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        //2.发送请求
        xhttp.open("GET", "http://localhost/AjaxServlet01?username="+username1);//路径是全路jing:http://localhost//AjaxServlet01
        xhttp.send();
        //3.获取响应数据

        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {

                if (this.responseText == "true") {
                    //用户名存在，显示提示信息'
                    document.getElementById("username_error").style.display = 'block';
                } else {
                    //用户名不存在，清楚提示信息
                    document.getElementById("username_error").style.display='none';
                }

            }
        };
        
    }
</script>
</body>
</html>

十一、Axios

Axios 是一个基于 promise 网络请求库，作用于node.js 和浏览器中。 它是 isomorphic 的(即同一套代码可以运行在浏览器和node.js中)。在服务端它使用原生 node.js http 模块, 而在客户端 (浏览端) 则使用 XMLHttpRequests。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--引入axios文件-->
    <script src="js/axios-0.18.0.js"></script>

</head>
<body>
    <script>
<!--        get方式-->
        axios({
            method:"get",
            url:"http://localhost/AxiosServlet?username=zhangsan"
        }).then(function (resp) {
            alert(resp.data);
        })
// 发起一个post请求
//         axios({
//             method: "post",
//             url: 'http://localhost/AxiosServlet?username=zhangsan',
//             data: "username=zhangsan"
//         }).then(function (resp) {
//             alert("post方式");
//
//         })
    </script>
</body>
</html>

在这里插入图片描述

Radan小哥
关注
ajax学习笔记
11-30
### AJAX学习笔记 #### 一、引言 Ajax（Asynchronous JavaScript and XML）是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。...
16ajax学习笔记1
08-08
在本篇16ajax学习笔记1中，我们将探讨Ajax的基础概念、使用方法以及jQuery库中的Ajax实现。 1、发送请求： Ajax的首要任务是创建XMLHttpRequest对象，这是浏览器提供的API。在JavaScript中，我们可以通过new ...
Ajax学习笔记
2301_82244607的博客
04-28 1047
XMLHttpRequest()：创建 XHR 对象的构造函数status：响应状态码值，如 200、404statusText：响应状态文本，如 ’ok‘、‘not found’readyState：标识请求状态的只读属性 0-1-2-3-4onreadystatechange：绑定 readyState 改变的监听responseType：指定响应数据类型，如果是 ‘json’，得到响应后自动解析响应response：响应体数据，类型取决于 responseType 的指定。
史上最详细Ajax学习笔记
楠黎倾风的博客
09-19 8045
史上最强Ajax学习笔记
黑马---ajax学习笔记
texry的博客
11-25 354
ajax
jquery中ajax学习笔记4
10-28
### jQuery中Ajax学习笔记4：缓存问题与中文问题详解 #### 缓存问题解析 在Web开发过程中，经常会遇到浏览器缓存导致的数据更新问题。本文档将详细讲解如何识别和解决缓存问题。 ##### 什么是缓存问题？ 缓存...
Ajax学习笔记个人总结
09-12
### Ajax学习笔记个人总结 #### 一、XMLHttpRequest对象简介 **XMLHttpRequest** 对象是 AJAX 技术的核心，它负责在客户端与服务器之间发送异步请求，无需刷新整个页面即可实现局部数据更新。要使用 ...
JavaScript 基础 - 第17天_AJAX综合案例
八年大厂一线老程序员。现独立开发创业中，并且已经靠独立开发赚取人生第一桶金。
09-14 1260
完成案例-图书管理系统（增删改查）经典业务
AJAX(一）HTTP协议(请求响应报文)，AJAX发送请求，请求问题处理
qq_44285582的博客
09-17 1308
原生AJAX发送Get，Post请求。响应JSON数据的两种方式。如何捕获AJAX请求超时与网络异常的清空。abort函数取消请求。解决请求重复发送的问题
AJAX 入门 day3
2301_77358195的博客
09-16 1046
学习之前先了解一下ajax和axios之间的区别：是一种允许网页在后台与服务器进行数据交换的技术，而不需要重新加载整个页面。它不是一种特定的库或框架，而是一种实现异步数据传输的通用方法。，它适用于浏览器和 node.js。（在浏览器中）或 node.js 的原生 HTTP 模块，但它抽象了它们的复杂性，使得发送请求更加容易。在现代前端开发中，Axios 被广泛推荐用来发起 HTTP 请求，因为它简单易用，并且容易集成到常见的进程式任务中，如 React、Vue 或 Angular 应用。
学习笔记JVM篇（五）
仔哥学编程
09-17 965
代码解析：首先根据处理器数量来确定创建的线程数量，然后创建线程不断的死循环执行一些逻辑，这样可以让CPU寻思飙高。JPS全称 Java Process Status Tool，这个命令与Liunx的PS很像，下面我们测试一下这个命令，首先编写一段非常简单的Java代码。jstack是java栈的跟踪器，可以打印出java应用程序中所有线程的信息、包含堆栈信息、调用栈信息、锁等信息，所以常用于诊断死锁、内存泄漏等等。使用JPS命令，可以看到我们刚才启动的Java进程，同时进程号为7484。
探索《越南语翻译通》App：高效语言学习的利器
最新发布
工作姬
09-20 292
无论您是语言学习新手还是希望提高语言技能的专业人士，这款App都能为您提供帮助。它的学习材料覆盖了语言学习的各个方面，帮助用户全面掌握新语言。随着科技的发展，我们有了更多便捷的工具来帮助我们学习新的语言。今天，我们来探索一款名为《越南语翻译通》的App，它正逐渐成为语言学习者的新宠。《越南语翻译通》App采用了先进的AI技术，能够根据用户的学习进度和习惯，提供个性化的学习建议。它不仅提供了丰富的语言学习资源，还具备实时翻译功能，帮助用户在实际对话中快速理解和使用新语言。
网络工程师学习笔记——网络互连与互联网
2301_77279557的博客
09-14 915
网络互连相关技术
看Threejs好玩示例，学习创新与技术(二)
htsitr2的专栏
09-14 569
它的主要特点是确保生成的点之间保持一定的最小距离，从而避免点的聚集。这种方法在计算机图形学、游戏开发、物理模拟等领域中非常有用，尤其是在需要生成自然分布的对象（如树木、石头等）时。如果不进行裁剪，那么效果如下（初步的锯齿感是因为矩形内采样的结果）。为啥这么复杂呢，为啥不开始存储每个方块的UV呢？下面代码的vTexCoords（=savedModelMatrix，已修改）记录方块所在的位置，vWorldPosition表示方块中像素的偏移。在上面那副图中，聪明的你一定初步猜到了每个方块的纹理是怎么得到的。
source insight学习笔记
aa98865646的博客
09-18 391
比如常见好用的基础配置，常用的基础操作等。有时一些中文注释是 GB2312 的，使用默认的 UTF-8 编码打开就会编程乱码，可以依次点击菜单栏。比如下面我需要在当前文件中寻找extension这个符号的所有内容。这个一般是在当前文件中搜索，如果需要在整个项目搜索需要别的方式。代码出错用来定位的，也是很常用。看代码的时候经常需要查找某个字符，所以这个是必须要会的。选好颜色为RGB分别为200，240，200就可以了。PS：可以通过f3和f4上下切换搜寻到的结果。经常需要将查找到的字符进行替换。
哪些人适合学习人工智能?
weixin_44059661的博客
09-18 284
前端工程师、Java 工程师、大数据工程师等开发类工程师，学习人工智能具有很大的优势，他们普遍具备扎实的编程基础和丰富的企业项目开发经验，相对而言，这类人比理工科学生学习人工智能更容易。就计算机类专业的学生而言，他们所具备的优势在于出色的逻辑思维和强大的编程能力，这是掌握AI技术的关键。人工智能是一个多学科交叉、应用广泛的领域，它为不同背景的人提供了学习和发展的机会，无论是理工科学生、技术开发人员，还是来自其他行业的专业人士，只要对AI充满兴趣并愿意投入时间和精力，都有机会在AI领域取得成就。
Ajax学习笔记：从入门到精通
“Ajax学习经典笔记，适合初学者或者巩固知识用” Ajax（Asynchronous JavaScript and XML）是一种创建动态网页的技术，它允许在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。这篇经典笔记详细...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值