学习AJAX

已于 2022-04-12 21:53:58 修改
阅读量247 收藏
点赞数
分类专栏： 学习积累 文章标签： ajax java tomcat intellij-idea
于 2022-04-12 21:51:59 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/adeluoo/article/details/124135416
版权

第一章：原生 AJAX

1.1 AJAX 简介

  • AJAX 全称为 Asynchronous Javascript And XML，即异步 JS 和 XML
  • 通过 AJAX 可以在浏览器中向服务器发送异步请求，最大的优势：无刷新网页获取数据
  • AJAX 不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式

1.2 XML 简介

  • XML：可扩展标记语言
  • XML：被设计用来传输和存储数据
  • XML 和 HTML 类似，不同点：HTML 中都是预定义标签，XML 中没有预定义标签，全是自定义标签，用来表示一些数据
  • 现在已被 JSON 取代

1.3 AJAX 的特点

1.3.1 AJAX 的优点

  1. 可以无刷新页面与服务端进行通信
  2. 允许你根据用户事件来更新部分页面内容

1.3.2 AJAX 的缺点

  1. 没有浏览历史，不能回退
  2. 存在跨域问题（同源）
  3. SEO 不友好（爬虫获取不到信息）

1.4 HTTP 协议

1.4.1 HTTP 请求报文

  1. 请求行
method url
GET /product_detail?id=2
POST /login
  1. 多个请求头
Host: www.baidu.com
Cookie: BAIDUID=AD3B0FA706E; BIDUPSID=AD3B0FA706;
Content-Type: application/x-www-form-urlencoded 或者 application/json
  1. 请求体
username=tom&pwd=123
{"username": "tom", "pwd": 123}

1.4.2 HTTP 响应报文

  1. 响应状态行
status statusText
  1. 多个响应头
Content-Type: text/html;charset=utf-8
Set-Cookie: BD_CK_SAM=1;path=/
  1. 响应体
html 文本/json 文本/js/css/图片...

1.4.3 post 请求体参数格式

  1. Content-Type: application/x-www-form-urlencoded;charset=utf-8
用于键值对参数，参数的键值用=连接, 参数之间用&连接
例如: name=%E5%B0%8F%E6%98%8E&age=12
  1. Content-Type: application/x-www-form-urlencoded;charset=utf-8
用于 json 字符串参数
例如: {"name": "%E5%B0%8F%E6%98%8E", "age": 12}
  1. Content-Type: multipart/form-data
用于文件上传请求

1.4.2 常见的响应状态码

  • 200 OK 请求成功。一般用于GET 与POST 请求
  • 201 Created 已创建。成功请求并创建了新的资源
  • 401 Unauthorized 未授权/请求要求用户的身份认证
  • 404 Not Found 服务器无法根据客户端的请求找到资源
  • 500 Internal Server Error 服务器内部错误，无法完成请求

1.4.3 不同类型的请求及其作用

  • GET: 从服务器端读取数据（查）
  • POST: 向服务器端添加新数据 （增）
  • PUT: 更新服务器端已经数据 （改）
  • DELETE: 删除服务器端数据 （删）

1.4.4 API 的分类

REST API: restful （Representational State Transfer (资源)表现层状态转化）

  1. 发送请求进行 CRUD 哪个操作由请求方式来决定
  2. 同一个请求路径可以进行多个操作
  3. 请求方式会用到 GET/POST/PUT/DELETE

非 REST API: restless

  1. 请求方式不决定请求的CRUD 操作
  2. 一个请求路径只对应一个操作
  3. 一般只有GET/POST

1.4.5 区别 一般 HTTP 请求 与 AJAX 请求

AJAX 请求 是一种特别的 HTTP 请求
对服务器端来说, 没有任何区别, 区别在浏览器端
浏览器端发请求: 只有 XHR 或 fetch 发出的才是 AJAX 请求, 其它所有的都是非 AJAX 请求

浏览器端接收到响应

  1. 一般请求: 浏览器一般会直接显示响应体数据, 也就是我们常说的刷新/跳转页面
  2. AJAX 请求: 浏览器不会对界面进行任何更新操作, 只是调用监视的回调函数并传入响应相关数据

第二章：原生 AJAX 的基本使用 XHR

2.1 核心对象（XML）使用步骤

  1. 创建 XMLHttpRequest 对象
const xhr = new XMLHttpRequest();
  1. 设置请求信息
// 请求方式  method = get/post...   url = https://www.gitee……
xhr.open(method, url);
//可以设置请求头，一般不设置
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  1. 发送请求
xhr.send(body) //get请求不传 body 参数，只有post请求使用
  1. 接收响应（事件绑定，处理服务端返回的结果）
//xhr.responseXML 接收 xml格式 的响应数据
//xhr.responseText 接收 文本格式 的响应数据
xhr.onreadystatechange = function (){
	// readyState 是 xhr对象中的属性, 表示状态 0 1 2 3 4
	if(xhr.readyState == 4 && xhr.status == 200){
		var text = xhr.responseText;
		console.log(text);
	}
}

4.1 readystate

0：未初始化
1：open 方法调用完毕
2：send 方法已经调用完毕
3：服务端返回的部分结果
4：服务器端返回的全部结果

2.2 GET 请求

  1. 服务端代码
@WebServlet("/login")
public class DemoService extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // 设置响应头,通过一个头 Content-Type 告知客户端使用何种码表进行编码
        // 旧：response.setHeader("Context-Type", "text/html;charset=UTF-8"); // 文本为 html 类型， 编码为 utf-8
        response.setContentType("text/html;charset=UTF-8");
        // 设置响应体
        PrintWriter writer = response.getWriter();
        writer.write("你好");
    }
}
  1. 客户端代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>GET 请求方式</title>
</head>
<body>
<button>点击</button>
<h2 id="result"> </h2>
<script>
    // 获取 buttom 元素
    const btn = document.getElementsByTagName('button')[0];
    // 绑定事件
    btn.onclick = function () {
        // 1、创建对象
        const xhr = new XMLHttpRequest();
        const res = document.getElementById("result")
        // 2、初始化，设置请求方法和URL  2.1 设置 url 参数的一种方式
        xhr.open('GET','http://localhost:8080/ajax01/succeed.html?name=tom&sex=男&age=12')
        // 3、发送
        xhr.send();
        // 4、事件绑定 处理服务器返回结果
        // on when 当。。。时候
        // readystate 是 xhr 对象中的属性，表示状态 0 1 2 3 4
        // change 改变
        xhr.onreadystatechange = function () {
            // 判断（服务器端是否返回了所有的结果）
            if(xhr.readyState == 4){
                // 判断响应状态码 200 404 403 401 500
                // 2xx 成功
                if(xhr.status >= 200 && xhr.status < 300){
                    // 处理结果 行 头 空行 体
                    // 1、响应行
                    console.log(xhr.status); // 状态码
                    console.log(xhr.statusText); // 状态字符串
                    console.log(xhr.getAllResponseHeaders()); // 所有响应头
                    console.log(xhr.response); // 响应体

                    // 设置 res 的文本
                    res.innerHTML = xhr.response;
                }else {
                    console.log('失败');
                }
            }
        }
    }
</script>
</body>
</html>

2.3 post 请求

  1. 服务端代码
@Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    /* 允许跨域的主机地址 */
    response.setHeader("Access-Control-Allow-Origin", "*");
    /* 允许跨域的请求方法GET, POST, HEAD 等 */
        response.setHeader("Access-Control-Allow-Methods", "*");
    // 设置响应头
    response.setContentType("text/html;charset=UTF-8");
    // 设置响应体
    PrintWriter writer = response.getWriter();
    writer.write("你好");
}
  1. 前端代码
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Ajax POST 请求</title>
  <style>
    #result {
      width: 200px;
      height: 100px;
      border: solid 1px #903;
    }
  </style>
</head>
<body>
  <div id="result"></div>
  <script>
    // 获取元素对象
    const result = document.getElementById('result');
    // 绑定事件
    result.addEventListener("mouseover", function(){
      // 1. 创建对象
      const xhr = new XMLHttpRequest();
      // 2. 初始化 设置类型（请求方式）与url
      xhr.open('POST', 'http://127.0.0.1:8000/server');
      // 3. 发送   设置请求参数（请求体）
      xhr.send('a=100&b=200&c=300');
      // 4. 事件绑定
      xhr.onreadystatechange = function(){
        // 判断
        if(xhr.readyState === 4){
          if(xhr.status >=200 && xhr.status < 300){
            // 处理服务端返回的结果
            result.innerHTML = xhr.response;
          }
        }
      }
    });
  </script>
</body>
</html>

2.4 json 数据格式

  1. 服务端代码
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // 设置响应头,通过一个头 Content-Type 告知客户端使用何种码表进行编码
    // 旧：response.setHeader("Context-Type", "text/html;charset=UTF-8"); // 文本为 html 类型， 编码为 utf-8
    response.setContentType("text/html;charset=UTF-8");
    // 创建一个 json 对象
    JSONObject obj = new JSONObject();
    obj.put("name","张三");
    // 将 json 对象转换为字符串
    String str = JSON.toJSONString(obj);
    // 设置响应体
    PrintWriter writer = response.getWriter();
    writer.write(str);
}
  1. 前端代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>GET 请求方式</title>
</head>
<body>
<button>点击</button>
<h2 id="result"> </h2>
<script>
    // 获取 buttom 元素
    const btn = document.getElementsByTagName('button')[0];
    const res = document.getElementById("result")
    // 绑定事件
    btn.addEventListener("mouseover", function () {
        // 1 创建对象
        const xhr = new XMLHttpRequest();
        // *2*.(自动转换) 设置响应体数据的类型(自动转换)
        xhr.responseType = 'json';
        // 2 初始化 设置类型 与 URL
        xhr.open("get","http://localhost:8080/ajax01/login")
        // 3 发送 post 可以设置参数 任意格式，只要后端能处理就行
        // xhl.send("123456")
        // xhl.send("name=q|&age=12|set=女")
        xhr.send()
        // 设置请求头
        // xhl.setRequestHeader('Content-Type','application/x-www-from-urlencoded');
       // xhl.setRequestHeader('name','costom');
        // 4 事件绑定
        xhr.onreadystatechange = function () {
            // 判断
            if(xhr.readyState == 4){
                if(xhr.status >= 200 && xhr.status < 300){
                    // 手动将字符串转成 json 对象
                    // let  data = JSON.parse(xhl.response);
                    // 自动装换
                    console.log(xhr.response)
                    // 处理服务端返回的结果
                    res.innerHTML = xhr.response.name;
                }else{
                    console.log("失败")
                }
            }
        }
    })
</script>
</body>
</html>

2.1 自动转换

// 2.(自动转换) 设置响应体数据的类型(自动转换)
xhr.responseType = 'json';
  1. 演示

test

2.5 请求超时与网络异常

// 超时设置 （2秒）
xhr.timeout = 2000;
// 超时回调
xhr.ontimeout = function(){
	alert('网络超时，请稍后重试')
}
// 网络异常回调
xhr.onerror = function(){
	alert('网络异常，请稍后重试')
}

2.6 取消请求

// 手动取消
xhr.abort()

2.7 请求重复发送问题

<script>
        //获取元素对象
        const btns = document.querySelectorAll('button');
        let x = null;
        //标识变量
        let isSending = false; // 是否正在发送AJAX请求

        btns[0].onclick = function(){
            //判断标识变量
            if(isSending) x.abort();// 如果正在发送, 则取消该请求, 创建一个新的请求
            x = new XMLHttpRequest();
            //修改 标识变量的值
            isSending = true;
            x.open("GET",'http://127.0.0.1:8000/delay');
            x.send();
            x.onreadystatechange = function(){
                if(x.readyState === 4){
                    //修改标识变量
                    isSending = false;
                }
            }
        }

        // abort
        btns[1].onclick = function(){
            x.abort();
        }
    </script>

2.8 解决 IE 缓存问题

问题：在一些浏览器中(IE),由于缓存机制的存在，ajax 只会发送的第一次请求，剩余多次请求不会在发送给浏览器而是直接加载缓存中的数据。
解决方案：浏览器的缓存是根据url 地址来记录的，所以我们只需要修改url 地址即可避免缓存问题

xhr.open("get","/testAJAX?t="+Date.now());

2.9 AJAX 请求状态

在这里插入图片描述

  • 0: 表示XMLHttpRequest 实例已经生成，但是open()方法还没有被调用
  • 1: 表示send()方法还没有被调用，仍然可以使用setRequestHeader()，设定HTTP请求的头信息
  • 2: 表示send()方法已经执行，并且头信息和状态码已经收到
  • 3: 表示正在接收服务器传来的body 部分的数据
  • 4: 表示服务器数据已经完全接收，或者本次接收已经失败了

2.10 API总结

  • XMLHttpRequest()：创建 XHR 对象的构造函数
  • status：响应状态码值，如 200、404
  • statusText：响应状态文本，如 ’ok‘、‘not found’
  • readyState：标识请求状态的只读属性 0-1-2-3-4
  • onreadystatechange：绑定 readyState 改变的监听
  • responseType：指定响应数据类型，如果是 ‘json’，得到响应后自动解析响应
  • response：响应体数据，类型取决于 responseType 的指定
  • timeout：指定请求超时时间，默认为 0 代表没有限制
  • ontimeout：绑定超时的监听
  • onerror：绑定请求网络错误的监听
  • open()：初始化一个请求，参数为：(method, url[, async])
  • send(data)：发送请求
  • abort()：中断请求 （发出到返回之间）
  • getResponseHeader(name)：获取指定名称的响应头值
  • getAllResponseHeaders()：获取所有响应头组成的字符串
  • setRequestHeader(name, value)：设置请求头

第三章：jQuery 中的 AJAX

3.1 get 请求

$.get(url, [data], [callback], [type])
  • url:请求的URL 地址
  • data:请求携带的参数
  • callback:载入成功时回调函数
  • type:设置返回内容格式，xml, html, script, json, text, _default
    例子
$('button').eq(0).click(function () {
            // data 就是响应体
            $.get('http://localhost:8080/ajax01/login',{a:100,b:200},function (data) {
                console.log(data)
            },'json')
        })

3.2 post 请求

$.post(url, [data], [callback], [type])
  • url:请求的URL 地址
  • data:请求携带的参数
  • callback:载入成功时回调函数
  • type:设置返回内容格式，xml, html, script, json, text, _default
    例子
$('button').eq(1).click(function () {
            $.post('http://localhost:8080/ajax01/login',{a:100,b:200},function (data) {
                console.log(data)
            })
        })

3.3 通用方法

$('button').eq(2).click(function () {
    $.ajax({
        // url 需要向那个资源请求
        url: 'http://localhost:8080/ajax01/login',
        // 参数 向服务端传数据
        data: {a:100,b:200},
        // 请求类型 GET/POST/PUT/DELETE
        type: 'GET',
        // 响应体结果，服务端返回的数据格式，不写就是字符串
        dataType: 'json',
        // 成功的回调 data 就是响应体
        success: function (data) {
            console.log(data)
        },
        // 超时时间
        timeout: 2000,
        // 失败的回调
        error: function () {
            console.log('出错啦！！！')
        },
        // 头信息
        headers: {
            c:300,
            d:400
        }
    })
})

3.4 Axios 函数发送 AJAX 请求

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>axios 发送 AJAX请求</title>
    <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/axios/0.19.2/axios.js"></script>
</head>

<body>
    <button>GET</button>
    <button>POST</button>
    <button>AJAX</button>

    <script>
        // https://github.com/axios/axios
        const btns = document.querySelectorAll('button');

        //配置 baseURL
        axios.defaults.baseURL = 'http://127.0.0.1:8000';

        btns[0].onclick = function () {
            //GET 请求
            axios.get('/axios-server', {
                //url 参数
                params: {
                    id: 100,
                    vip: 7
                },
                //请求头信息
                headers: {
                    name: 'atguigu',
                    age: 20
                }
            }).then(value => {
                console.log(value);
            });
        }

        btns[1].onclick = function () {
            axios.post('/axios-server', {
                username: 'admin',
                password: 'admin'
            }, {
                //url 
                params: {
                    id: 200,
                    vip: 9
                },
                //请求头参数
                headers: {
                    height: 180,
                    weight: 180,
                }
            });
        }
    
        btns[2].onclick = function(){
            axios({
                //请求方法
                method : 'POST',
                //url
                url: '/axios-server',
                //url参数
                params: {
                    vip:10,
                    level:30
                },
                //头信息
                headers: {
                    a:100,
                    b:200
                },
                //请求体参数
                data: {
                    username: 'admin',
                    password: 'admin'
                }
            }).then(response=>{
                //响应状态码
                console.log(response.status);
                //响应状态字符串
                console.log(response.statusText);
                //响应头信息
                console.log(response.headers);
                //响应体
                console.log(response.data);
            })
        }
    </script>
</body>

</html>

3.5 fetch 函数发送 AJAX 请求

<script>
    //文档地址
    //https://developer.mozilla.org/zh-CN/docs/Web/API/WindowOrWorkerGlobalScope/fetch
    
    const btn = document.querySelector('button');

    btn.onclick = function(){
        fetch('http://127.0.0.1:8000/fetch-server?vip=10', {
            //请求方法
            method: 'POST',
            //请求头
            headers: {
                name:'atguigu'
            },
            //请求体
            body: 'username=admin&password=admin'
        }).then(response => {
            // return response.text();
            return response.json();
        }).then(response=>{
            console.log(response);
        });
    }
</script>
汉口君呐
关注
专栏目录
小白学习ajax
cj521zhihui的博客
08-25 1万+
HTTP学习 1.概念 1.客户端与服务器超本文无状态传输协议 2.http默认端口80 3.https 默认端口 443 2.请求方法 1.options：测试有哪些方法可以用 2.get：获取服务信息 3.Post： 修改与更新，新增服务器信息 4.put：新增 5.delete：删除 6.head 只返回头信息 7.trace：回显头信息，用来测试 8.connect： 管道形式连接 3.请求过程 建立tcp连接 客户端发送请求头+请求体 服务器响应请求头+请求体 ，关闭tcp连接 客户端
AJAX 学习
weixin_43466639的博客
05-04 1355
AJAX 一、基本理论 1、定义 AJAX 是一种从网页访问 Web 服务器的异步无刷新技术。 异步：同步是必须等待请求返回结果之后，才能继续其他操作。异步是可以在等待的时间里去继续其他操作，当响应就绪后对响应进行处理。 无刷新：按需加载。（当点击查看更多的时候，就会结合DOM向服务器请求将数据追加进去，并没有刷新页面） 无刷新场景：如果要让用户留在当前页面中，同时发出新的HTTP请求，就必须用JavaScript发送这个新请求，接收到数据后，再用JavaScript更新页面，这样一来，用户就感觉自己仍然
学习ajax前需要掌握哪些知识,掌握 Ajax(一): Ajax 入门简介
weixin_39571938的博客
08-07 1492
加入一些 JavaScript得到 XMLHttpRequest 的句柄后，其他的 JavaScript 代码就非常简单了。事实上，我们将使用 JavaScript 代码完成非常基本的任务：获取表单数据：JavaScript 代码很容易从 HTML 表单中抽取数据并发送到服务器。修改表单上的数据：更新表单也很简单，从设置字段值到迅速替换图像。解析 HTML 和 XML：使用 JavaScript ...
从零开始学习 AJAX：超详细！15 分钟搞定 AJAX 原理和使用方法
热门推荐
weixin_56242678的博客
05-27 1万+
本文将会介绍 AJAX 的原理和使用方法，并帮助你在短时间内掌握这一重要的前端技术。我们将从 AJAX 的基本概念入手，深入探讨 AJAX 的核心技术——XMLHttpRequest 对象以及常用的数据交互方式。通过本文的学习，你将能够轻松地了解 AJAX 的工作方式和应用场景，从而为你的 Web 应用程序添加更多的交互性和实时性。
Ajax交互技术学习
dsadfaa的博客
09-04 983
页面发起请求，会将请求发送给浏览器内核中的Ajax引擎，Ajax引擎会提交请求到服务器端，在这段时间里，客户端可以任意进行任意操作，直到服务器端将数据返回给Ajax引擎后，会触发你设置的事件，从而执行自定义的js逻辑代码完成某种页面功能。JQuery是一个优秀的js框架，自然对JS原生的Ajax进行了封装，封装后的Ajax的操 作方法更简洁，功能更强大，与ajax操作相关的jquery方法有如下几种，但开发中 经常使用的有三种。success：成功响应执行的函数，对应的类型是function类型。
零基础学习AJAX之AJAX框架
12-11
上文（零基础学习AJAX之AJAX的简介和基础）对ajax异步请求服务器做了详细的介绍和基础应用，可以看出，ajax的一些过程是相对不变的。不必要每次发送请求都写一遍发送代码，一些ajax开发人员已经把他们的过程封装成...
源代码-Ajax+XML简单房产程序 v1.0（适合学习ajax+xml）.zip
05-06
该资源是一个名为"源代码-Ajax+XML简单房产程序 v1.0（适合学习ajax+xml）.zip"的压缩包，主要针对想要学习Ajax和XML技术的IT学习者。Ajax，全称Asynchronous JavaScript and XML（异步JavaScript和XML），是一种在...
学习ajax用的各种文档
01-08
本资料包“学习ajax用的各种文档”提供了丰富的资源，帮助学习者深入理解和掌握Ajax的核心概念和应用。** ### 一、Ajax基础 1. **异步通信**: Ajax的核心是JavaScript对象XMLHttpRequest，它允许在后台与服务器通信...
基于ASP的Ajax+XML简单房产程序 v1.0（适合学习ajax+xml）.zip
07-10
"基于ASP的Ajax+XML简单房产程序 v1.0（适合学习ajax+xml）" 这个标题揭示了我们所讨论的是一个Web应用程序，它利用了Active Server Pages (ASP) 技术来构建，并且集成了Ajax（异步JavaScript和XML）和XML（可扩展...
学习Ajax的JSP范例，一个简单留言本
05-17
在“学习Ajax的JSP范例”中，核心是利用Ajax进行无刷新提交。当用户在留言本上输入留言并点击提交按钮时，Ajax会将数据发送到服务器，而不是像传统方式那样刷新整个页面。这一过程通常涉及以下几个步骤： 1. **前端...
ssm+ajax使用于学习ajax的新手案例
03-31
本案例针对初次接触Ajax的学习者，提供了验证用户名是否已存在的实际操作，有助于理解和掌握这两种技术的协同工作原理。 首先，让我们详细了解一下SSM框架。SSM是Java Web开发中的三大核心框架，Spring作为整体的...
AJAX 全面教程：从基础到高级
孤客科技
11-07 765
AJAX（Asynchronous JavaScript and XML）是一种用于创建快速动态网页的技术。它允许网页在不重新加载整个页面的情况下，与服务器进行异步通信。AJAX 的核心在于 JavaScript 和 XMLHttpRequest 对象的使用，虽然现在 JSON 逐渐取代了 XML，但 AJAX 的概念依然适用。AJAX 是现代网页开发中不可或缺的技术，通过异步请求提升用户体验和网页性能。
【Ajax】跨域
weixin_45980065的博客
11-06 793
CORS 是官方的跨域解决方案，它的特点是不需要在客户端做任何特殊的操作，完全在服务器中进行处理，支持 get 和 post 请求。CORS 是通过设置一个响应头来告诉浏览器，该请求允许跨域，浏览器收到该响应以后就会对响应放行。//这里因为是满足同源策略的, 所以 url 可以简写。//3. 将 script 插入到文档中。//1. 创建 script 标签。//2. 设置标签的 src 属性。//获取 result 元素。//修改 p 标签的提示文本。//获取 input 元素。违背同源策略就是跨域。
Ajax学习
supercool7的博客
11-04 368
5、启动tomcat测试！打开浏览器的控制台，当我们鼠标离开输入框的时候，可以看到发出了一个ajax的请求！是后台返回给我们的结果。AJAX：Asynchronous JavaScript and XML（异步的JavaScript和XML）1、配置web.xml和springmvc的配置文件。2、编写一个AjaxController。3、测试（及得处理json乱码问题）的情况下，能够更新部分网页的技术。4、编写index.jsp。3、 导入jquery。
Spark集群模式搭建之Yarn模式
weixin_63297999的博客
11-08 412
我的spark压缩包在/opt/modules 将spark解压到/opt/installs。#因为YARN中运行Spark，需要用到Spark的一些类和方法。#如果不上传到HDFS，每次运行YARN都要上传一次，比较慢。#所以自己手动上传一次，以后每次YARN直接读取即可。假如你遇到这个输出，说明资源有限，可以等一等。xsync.sh 是分发文件脚本 详细可以看。将解压后的文件重命名，并对设置一个软连接。
spring循环依赖解决方式
qq_36400213的博客
11-04 890
字段注入和setter注入则提供了更多的灵活性，但需要更谨慎地管理对象的状态。方法注入和注解注入则适用于特定的场景。在Spring框架中，依赖注入（Dependency Injection，DI）是一种实现控制反转（Inversion of Control，IoC）的机制，用于将对象的依赖关系自动注入到对象中。这种方式不如构造器注入严格，但比字段注入更灵活，因为它可以在不创建新实例的情况下改变对象的依赖。这种方式是推荐的，因为它可以保证对象在创建时就处于完全初始化的状态，并且可以使得bean不可变。
JAVA-01-变量
LJH_laura_li的博客
11-08 159
在方法、构造函数或块内部定义的变量。
2024年华为OD机试真题-查找充电设备-C++-OD统一考试（E卷）
面试高手的博客
11-08 40
某个充电站，可提供n个充电设备只，每个充电设备均有对应的输出功率任意个充电设备组合的输出功率总和，均构成功率集合P的1个元素功率集合P的最优元素，表示最接近充电站最大输出功率pmax 的元素。每一题都含有详细的解题思路和代码注释，精编c++、JAVA、Python三种语言解法。当充电设备输出功率50、20、20组合时，其输出功率总和为90，最接近充电站最大充电输出功率，因此最优元素为90。所有充电设备的输出功率组合，均大于充电站最大充电输出功率30，此时最优元素值为0。第 2 行为每个充电设备的输出功率。
JAVA学习接口案例实例
最新发布
shangan_3的博客
11-08 100
【代码】JAVA学习接口案例实例。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值