JQuery(四)---【使用JQuery实现动画效果】

news2024/10/5 16:29:54

目录

前言

一.隐藏和显示

1.1使用方法

1.2案例演示(1)

1.3隐藏/显示效果一键切换

二.淡入淡出效果

2.1使用方法

 2.2案例演示(fadeIn)

2.3案例演示(fadeOut)

2.4案例演示(fadeToggle)

2.5案例演示(fadeTo)

三.滑动

3.1使用方法

 3.2案例演示(slideDown)

3.3案例演示(slideUp)

3.4案例演示(slideToggle)

四.动画【重要】

4.1使用方法

4.2案例演示

4.3使用队列功能实现多个动画

五.停止动画

5.1使用方法

5.2案例演示

六.callback函数

6.1使用方法

6.2为什么要使用callback函数

七.chaining绑定

7.1chaining介绍

7.2chaining使用方法

 7.3案例演示

前言

JQuery(一)---【JQuery简介、安装、初步使用、各种事件】-CSDN博客

JQuery(二)---【使用JQuery对HTML、CSS进行操作】-CSDN博客

JQuery(三)---【使用JQuery动态设置浏览器窗口尺寸、JQuery的遍历】-CSDN博客

一.隐藏和显示

1.1使用方法

通过JQuery可以使用：“hide()”和“show()”方法来隐藏和显示HTML元素：

使用格式：

  • “hide”：$(selector).hide(speed,callback)
  • “show”：$(selector).show(speed,callback)

两个参数：

  1. speed：规定隐藏/显示的速度，可以取以下值：“slow”、“fast”、“100”(毫秒数值)
  2. callback：隐藏或显示完成后所执行的函数

1.2案例演示(1)

下面是一个：“点击按钮来控制div标签显示/隐藏的案例”

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <p id="p1">如果点击“隐藏”按钮,我就会消失</p>
    <button id="hide">隐藏</button>
    <button id="show">显示</button>
    <script>
        $(document).ready(function(){
            $("#hide").click(function(){
                $("#p1").hide();
            });
            $("#show").click(function(){
                $("#p1").show();
            });
        });
    </script>
</body>
</html>

点击前：

点击后：

1.3隐藏/显示效果一键切换

除了手动使用：“hide()”和“show()”方法来设置某个元素的状态，我们还可以使用：“toggle()”方法来自动进行状态的切换，切换规则如下：

  1. “如果当前是显示状态，那么就会切换到隐藏状态”
  2. “如果当前是隐藏状态，那么就会切换到显示状态

 使用格式：

  • $(selector).toggle(speed,callback)

 这里的“speed”和“callback”参数使用同上，就不再赘述了

二.淡入淡出效果

2.1使用方法

通过JQuery可以实现元素的淡入淡出，即渐变式消失/隐藏

我们通过以下四种方法实现：

  1. “fadeIn(speed,callback)”：淡入已隐藏元素(将隐藏元素渐变的显示出来)
  2. “fadeOut(speed,callback)”：淡出可见元素(将可见元素渐变的隐藏)
  3. “fadeToggle(speed,callback)”：淡入隐藏/可见元素(将隐藏/可见元素渐变的显示/隐藏)
  4. “fadeTo(speed,opacity,callback)”：淡出可见元素(将可见元素渐变的隐藏)同时允许指定淡出的不透明度(值介于0-1之间)

 2.2案例演示(fadeIn)

下面是一个：“点击按钮之后，将三个隐藏的不同颜色的矩形渐变的显示出来”

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <p>演示带有不同参数的fadeIn方法</p>
    <button id="bt1">点击之后,将三个矩形淡入</button>
    <br><br>
    <div id="div1" style="width: 80px;height: 80px;background-color: red;margin: 10px;display: none;"></div>
    <div id="div2" style="width: 80px;height: 80px;background-color: green;margin: 10px;display: none;"></div>
    <div id="div3" style="width: 80px;height: 80px;background-color: blue; margin: 10px;display: none;"></div>
    <script>
        $(document).ready(function(){
            $("#bt1").click(function(){
                $("#div1").fadeIn();
                $("#div2").fadeIn("slow");
                $("#div3").fadeIn(3000);
            });
        });
    </script>
</body>
</html>

点击前：

点击后：

动图不方便制作，建议小伙伴们自己敲一下代码，看一下这个动画效果

2.3案例演示(fadeOut)

下面是一个：“点击按钮之后，将三个不同颜色的矩形渐变的隐藏”

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <p>演示带有不同参数的fadeIn方法</p>
    <button id="bt1">点击之后,将三个矩形淡入</button>
    <br><br>
    <div id="div1" style="width: 80px;height: 80px;background-color: red;margin: 10px;"></div>
    <div id="div2" style="width: 80px;height: 80px;background-color: green;margin: 10px;"></div>
    <div id="div3" style="width: 80px;height: 80px;background-color: blue; margin: 10px;"></div>
    <script>
        $(document).ready(function(){
            $("#bt1").click(function(){
                $("#div1").fadeOut();
                $("#div2").fadeOut("slow");
                $("#div3").fadeOut(3000);
            });
        });
    </script>
</body>
</html>

点击前：

点击后：

2.4案例演示(fadeToggle)

下面是一个：“点击按钮之后，将三个不同颜色的矩形渐变的隐藏/显示”

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <p>演示带有不同参数的fadeIn方法</p>
    <button id="bt1">点击之后,将三个矩形切换状态</button>
    <br><br>
    <div id="div1" style="width: 80px;height: 80px;background-color: red;margin: 10px;"></div>
    <div id="div2" style="width: 80px;height: 80px;background-color: green;margin: 10px;"></div>
    <div id="div3" style="width: 80px;height: 80px;background-color: blue; margin: 10px;"></div>
    <script>
        $(document).ready(function(){
            $("#bt1").click(function(){
                $("#div1").fadeToggle();
                $("#div2").fadeToggle("slow");
                $("#div3").fadeToggle(3000);
            });
        });
    </script>
</body>
</html>

效果：

建议小伙伴自己敲代码看一下过程，这个动画还是很不错的！

2.5案例演示(fadeTo)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <p>演示带有不同参数的fadeIn方法</p>
    <button id="bt1">点击之后,将三个矩形切换状态</button>
    <br><br>
    <div id="div1" style="width: 80px;height: 80px;background-color: red;margin: 10px;"></div>
    <div id="div2" style="width: 80px;height: 80px;background-color: green;margin: 10px;"></div>
    <div id="div3" style="width: 80px;height: 80px;background-color: blue; margin: 10px;"></div>
    <script>
        $(document).ready(function(){
            $("#bt1").click(function(){
                $("#div1").fadeTo("slow",0.15);
                $("#div2").fadeTo("slow",0.4);
                $("#div3").fadeTo("slow",0.7);
            });
        });
    </script>
</body>
</html>

效果：

三.滑动

3.1使用方法

使用JQuery可以使元素实现滑动效果

JQuery提供了三种方法供我们滑动：

  • “slideDown(speed,callback)”：向下滑动元素
  • “slideUp(speed,callback)”：向上滑动元素
  • “slidToggle(speed,callback)”：在向上/向下滑动之间自动切换

 3.2案例演示(slideDown)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <style>
        .flip{
            width: 200px;
            background-color: #e5eecc;
            border: solid 1px #c3c3c3;
            text-align: center;
            padding: 5px;
            margin: 0px;
        }
        div.flip{
            height: 120px;
            display: none;
        }
    </style>
</head>
<body>
    <p class="flip">请点击这里</p>
    <div class="flip">
        <p>这是一个例子</p>
        <p>这是另一个例子</p>
    </div>
    <script>
        $(document).ready(function(){
            $("p.flip").click(function(){
                $("div.flip").slideDown("slow");
            });
        });
    </script>
</body>
</html>

点击前：

点击后：

3.3案例演示(slideUp)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <style>
        .flip{
            width: 200px;
            background-color: #e5eecc;
            border: solid 1px #c3c3c3;
            text-align: center;
            padding: 5px;
            margin: 0px;
        }
        div.flip{
            height: 120px;
        }
    </style>
</head>
<body>
    <div class="flip">
        <p>这是一个例子</p>
        <p>这是另一个例子</p>
    </div>
    <p class="flip">请点击这里</p>
    <script>
        $(document).ready(function(){
            $("p.flip").click(function(){
                $("div.flip").slideUp("slow");
            });
        });
    </script>
</body>
</html>

点击前：

点击后：

3.4案例演示(slideToggle)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <style>
        .flip{
            width: 200px;
            background-color: #e5eecc;
            border: solid 1px #c3c3c3;
            text-align: center;
            padding: 5px;
            margin: 0px;
        }
        div.flip{
            height: 120px;
        }
    </style>
</head>
<body>
    <div class="flip">
        <p>这是一个例子</p>
        <p>这是另一个例子</p>
    </div>
    <p class="flip">请点击这里</p>
    <script>
        $(document).ready(function(){
            $("p.flip").click(function(){
                $("div.flip").slideToggle("slow");
            });
        });
    </script>
</body>
</html>

效果：


使用“slideToggle”之后我们可以很方便的实现对元素滑动的控制

而使用“slideUp”和“slideDown”实现滑动，只能是单侧方向，并不能“收回”

四.动画【重要】

4.1使用方法

JQuery支持我们创建自定义的动画，从而实现“花里胡哨”的功能

使用“animate()”方法可以创建一个自定义动画

使用方法：

  • $(selector).animate({params},speed,callback)

参数说明：

  • params参数定义形成动画的CSS属性
  • speed规定动画的时长，可以取：“slow”、“fast”、“100(数值单位)”(毫秒)
  • callback表示动画完成后执行的函数

通过使用animate我们可以修改一个元素的“几乎所有的CSS”属性，从而实现更加复杂的动画效果

PS：“如果我们需要对某个元素实现移动动画，需要将这个元素的position属性设置为absolute、relative、fixed其中一种”

4.2案例演示

下面是一个：“点击按钮后，div矩形向右移动，并且透明度为50%，高度/宽度变为150”

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <button>开始动画</button>
    <p>默认情况下，所有 HTML 元素的位置都是静态的，并且无法移动。如需对位置进行操作，记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute。</p>
    <div style="background-color: aqua;height: 100px;width: 100px;position: absolute;"></div>
    <script>
        $(document).ready(function(){
            $("button").click(function(){
                $("div").animate({
                    left : '250px',
                    opacity : '0.5',
                    height : '150px',
                    width : '150px'
                });
            });
        });
    </script>
</body>
</html>

点击前：

点击后：

（ps：“除了使用固定值来控制移动的距离，我们也可以使用相对值来控制元素的移动，使用方法是在值的前面加上’+=‘或’-=‘来表示加或减”）

4.3使用队列功能实现多个动画

如果我们想要一次执行多个连续的动画，我们就需要使用：“队列”的功能

使用方法也很简单，就是一次性写入多个animate()方法即可

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <button>开始动画</button>
    <p>默认情况下，所有 HTML 元素的位置都是静态的，并且无法移动。如需对位置进行操作，记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute。</p>
    <div style="background-color: aqua;height: 100px;width: 100px;position: absolute;"></div>
    <script>
        $(document).ready(function(){
            $("button").click(function(){
                $("div").animate({height : '300px',opacity : '0.4'},"slow");
                $("div").animate({width : '300px',opacity : '0.8'},"slow");
                $("div").animate({height : '100px',opacity : '0.4'},"slow");
                $("div").animate({height : '100px',opacity : '0.8'},"slow");
            });
        });
    </script>
</body>
</html>

效果：

图片会不断进行依次进行四个方向的拉伸

五.停止动画

5.1使用方法

JQuery提供“stop()”方法在动画结束之前强制停止动画

使用方法：

  • $(selector).stop(stopAll,goToEnd);

参数说明：

  1. stopAll规定是否应该清除动画队列，默认是false，只停止这个动画，该动画所属队列中的其他动画不停止
  2. goToEnd规定是否立即完成当前动画(相当于强制完成动画省略过程也算停止了)，默认是false

5.2案例演示

下面是一个：“点击按钮后，div标签内容出现并且以很慢的速度向下滑动，直到点击停止滑动或者点击按钮停止”

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <button>停止滑动</button>
    <p id="sample">点我向下滑动面板</p>
    <div style="background-color: aqua;height: 200px;width: 200px;display: none;">
        <p>这是一个例子</p>
    </div>
    <script>
        $(document).ready(function(){
            $("#sample").click(function(){
                $("div").slideDown(5000);
            });
            $("button").click(function(){
                $("div").stop();
            });
        });
    </script>
</body>
</html>

效果：

六.callback函数

6.1使用方法

callback函数用来在动画100%完成后执行

callback函数将一个函数名作为一个参数传递给它

6.2为什么要使用callback函数

我们假设一个场景：“假设我们点击一个按钮之后，<p>段落会逐渐消失，并且在消失完成后会弹出一个弹窗提示<p>段落已经消失”

我们先看看不使用callback的状态：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <button>点我隐藏段落</button>
    <p id="sample">这是一个示例段落</p>
    <script>
        $(document).ready(function(){
            $("button").click(function(){
                $("#sample").hide();
                alert("段落被成功隐藏了");
            });
        });
    </script>
</body>
</html>

点击后：

可以看到，段落还没被隐藏，弹窗就已经出现了，此时我们点击“确定”后，段落才会被隐藏，这显而是不正确的。

错误原因：如果大家接触过软件开发，会明白软件开发中经常要用到多线程，在这里“隐藏功能”被视作一个“子线程”，而“弹窗”被视作一个“主线程”，此时“主线程”堵塞了“子线程”

如果我们使用callback函数，可以很好的解决这个问题：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <button>点我隐藏段落</button>
    <p id="sample">这是一个示例段落</p>
    <script>
        $(document).ready(function(){
            $("button").click(function(){
                $("#sample").hide(1000,function(){
                    alert("段落被成功隐藏了")
                ;});
            });
        });
    </script>
</body>
</html>

效果：

可以看到在动画完成后，弹窗才会出现

七.chaining绑定

7.1chaining介绍

JQuery允许我们将方法链接起来，使用链接可以方便我们对某些方法的复用

例如：“假设我们有一个id为p1的段落，我们想要它执行slideDown方法和slideUp方法”，我们可以很轻松的写出下面代码：

$("#p1").slideUp(1000);
$("#p1").slideDown(1000);

可以看到，我们写了两条语句，让这个元素执行这个两个功能

但是如果一个元素需要执行非常多的功能，假设有100个，我们就要写100条语句，这对于“程序员”来说很不方便！

为此，我们可以使用链接来简化书写！

7.2chaining使用方法

chaining使用方法：

  • $(selector).方法1.方法2.方法3.方法4.....

 7.3案例演示

下面的例子：

将css()，slideUp()，sildeDown()链接在p1上

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function()
  {
  $("button").click(function(){
    $("#p1").css("color","red").slideUp(2000).slideDown(2000);
  });
});
</script>
</head>

<body>

<p id="p1">jQuery 乐趣十足！</p>
<button>点击这里</button>

</body>
</html>

效果：

点击后p1会“依次”执行：“css()”、“slideUp”、“slideDown”

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1601706.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

三道模拟题

三道模拟题

P1003 [NOIP2011 提高组] 铺地毯 题目描述 原题点这里-->P1003 [NOIP2011 提高组] 铺地毯 - 洛谷 | 计算机科学教育新生态 (luogu.com.cn) 为了准备一个独特的颁奖典礼&#xff0c;组织者在会场的一片矩形区域&#xff08;可看做是平面直角坐标系的第一象限&#xff09;铺…
阅读更多...
黑马头条项目结构

黑马头条项目结构

微服务架构具有许多优点&#xff0c;其中一些主要优点包括&#xff1a; 松耦合性&#xff1a;每个微服务都是独立的&#xff0c;可以独立部署、独立扩展和独立更新&#xff0c;这种松耦合性使得系统更加灵活&#xff0c;易于维护和演化。 技术多样性&#xff1a;由于每个微服务…
阅读更多...
鸿蒙开发 @ohos/hypium找不到问题

鸿蒙开发 @ohos/hypium找不到问题

用的是最新的 开发工具 DevEco Studio 3.1.1 新建的空项目 报错 ohpm ERROR: Install failed ENOENT: no such file or directory, stat ‘E:\win\Project\MyApplication1\oh_modulesohos\hypium’ 解决方式 当前项目中 \oh_modules.ohpmohoshypium1.0.6\oh_modules 这里面有o…
阅读更多...
算法练习第19天|222.完全二叉树的节点个数

算法练习第19天|222.完全二叉树的节点个数

222.完全二叉树的节点个数 222. 完全二叉树的节点个数 - 力扣&#xff08;LeetCode&#xff09;https://leetcode.cn/problems/count-complete-tree-nodes/description/ 题目描述&#xff1a; 给你一棵 完全二叉树 的根节点 root &#xff0c;求出该树的节点个数。题目数据保…
阅读更多...
SpringBoot版本配置问题与端口占用

SpringBoot版本配置问题与端口占用

前言 ​ 今天在配置springboot项目时遇到了一些问题&#xff0c;jdk版本与springboot版本不一致&#xff0c;在使用idea的脚手架创建项目时&#xff0c;idea的下载地址是spring的官方网站&#xff0c;这导致所下载的版本都是比较高的&#xff0c;而我们使用最多的jdk版本是jdk…
阅读更多...
淘宝API接口开发系列：采集商品视频，属性，sku价格，详情图等

淘宝API接口开发系列：采集商品视频，属性，sku价格，详情图等

淘宝API接口开发是一个复杂的过程&#xff0c;涉及到与淘宝开放平台的对接&#xff0c;以及理解和使用其提供的API。如果你想采集商品视频、属性、SKU价格、详情图等信息&#xff0c;你需要遵循淘宝开放平台的开发者文档&#xff0c;并确保你的应用已经获得了适当的权限。 1.请…
阅读更多...
关于C#程序（Windows窗体应用）的退出询问

关于C#程序（Windows窗体应用）的退出询问

在一般的软件中我们常常会发现当我们退出系统的时候&#xff0c;总会有提示 那我们来看看这个是怎么实现的&#xff1a; 首先单击退出按钮&#xff0c;进入到我们的退出按钮属性&#xff0c;点击闪电标志&#xff1a; 找到FormClosing&#xff0c;双击进入 进行代码写入&…
阅读更多...
Learn SRP 02

Learn SRP 02

3.Editor Rendering 3.1Drawing Legacy Shaders 因为我们的管线只支持无光照的着色过程&#xff0c;使用其他不同的着色过程的对象是不能被渲染的&#xff0c;他们被标记为不可见。尽管这是正确的&#xff0c;但是它还是隐藏了场景中一些使用错误着色器的对象。所以让我们来渲…
阅读更多...
【Golang】并发编程之三大问题：原子性、有序性、可见性

【Golang】并发编程之三大问题：原子性、有序性、可见性

目录 一、前言二、概念理解2.1 有序性2.2 原子性后果1&#xff1a;其它线程会读到中间态结果&#xff1a;后果2&#xff1a;修改结果被覆盖 2.3 可见性1&#xff09;store buffer(FIFO)引起的类似store-load乱序现象2&#xff09;store buffer(非FIFO)引起的类似store-store乱序…
阅读更多...
代理模式（结构型模式）

代理模式（结构型模式）

目录 1、概述 2、结构 2.1、角色分类 2.2、类图 3、静态代理 3.1、案例类图 3.2、案例代码 4、JDK 动态代理 4.1、案例代码 4.2、底层原理 4.3、执行流程说明 5、CGLib 动态代理 5.1、案例代码 6、三种代理的对比 6.1、JDK代理和CGLib代理 6.2、动态代理和静态…
阅读更多...
【Latex排版小记录】latex设置两端对齐

【Latex排版小记录】latex设置两端对齐

Latex排版的时候遇到了公式/英文过长超出来的情况 解决办法&#xff1a;在\begin{document}里面增加\begin{sloppypar} \begin{document} \begin{sloppypar}\end{sloppypar} \end{document}
阅读更多...
Spring Boot - 利用MDC（Mapped Diagnostic Context）实现轻量级同步/异步日志追踪

Spring Boot - 利用MDC（Mapped Diagnostic Context）实现轻量级同步/异步日志追踪

文章目录 Pre什么是MDC&#xff08;Mapped Diagnostic Context&#xff09;Slf4j 和 MDC基础工程工程结构POMlogback-spring.xmlapplication.yml同步方式方式一&#xff1a; 拦截器自定义日志拦截器添加拦截器 方式二&#xff1a; 自定义注解 AOP自定义注解 TraceLog切面 测试…
阅读更多...
Java实现优先级队列(堆)

Java实现优先级队列(堆)

前言 在学习完二叉树的相关知识后&#xff0c;我们对数据结构有了更多的认识&#xff0c;本文将介绍到优先级队列(堆&#xff09; 1.优先级队列 1.1概念 前面介绍过队列&#xff0c;队列是一种先进先出(FIFO)的数据结构&#xff0c;但有些情况下&#xff0c;操作的数据可能…
阅读更多...
【机器学习】探究Q-Learning通过学习最优策略来解决AI序列决策问题

【机器学习】探究Q-Learning通过学习最优策略来解决AI序列决策问题

꒰˃͈꒵˂͈꒱ write in front ꒰˃͈꒵˂͈꒱ ʕ̯•͡˔•̯᷅ʔ大家好&#xff0c;我是xiaoxie.希望你看完之后,有不足之处请多多谅解&#xff0c;让我们一起共同进步૮₍❀ᴗ͈ . ᴗ͈ აxiaoxieʕ̯•͡˔•̯᷅ʔ—CSDN博客 本文由xiaoxieʕ̯•͡˔•̯᷅ʔ 原创 CSDN …
阅读更多...
学会 Python 后可以做什么副业？

学会 Python 后可以做什么副业？

近年来&#xff0c;Python凭借其简洁易入门的特点受到越来越多人群的青睐。 当然这不仅仅是针对程序员来说&#xff0c;对于一些学生、职场人士也是如此。 Python为什么会大受欢迎呢&#xff1f;因为Python还被大家称为“胶水语言&#xff0c;它适用于网站、桌面应用开发、[自…
阅读更多...
蓝牙耳机哪个牌子好用？力荐五款实力超群机型，快收藏！

蓝牙耳机哪个牌子好用？力荐五款实力超群机型，快收藏！

​随着蓝牙耳机的普及&#xff0c;越来越多的年轻人开始追求这种无线的便利。市场上品牌众多&#xff0c;款式多样&#xff0c;选择起来确实让人眼花缭乱。我整理了一份蓝牙耳机品牌排行榜前十名&#xff0c;希望能为你提供一些参考&#xff0c;帮助你找到心仪的耳机。 一、如何…
阅读更多...
C语言堆区内存管理

C语言堆区内存管理

一、C语言编译的内存分配 二、堆区空间的分配 1、malloc函数 功能&#xff1a;从堆区分配内存 #include <stdlib.h> void *malloc(unsigned int size)//size 分配内存的字节数2、free函数 功能&#xff1a;释放内存 #include <stdlib.h> void free(void *ptr)…
阅读更多...
L2-045 堆宝塔 - java

L2-045 堆宝塔 - java

L2-045 堆宝塔 Java (javac) 时间限制 500 ms 内存限制 256 MB 其他编译器 时间限制 400 ms 内存限制 64 MB 栈限制 8192 KB 题目描述&#xff1a; 堆宝塔游戏是让小朋友根据抓到的彩虹圈的直径大小&#xff0c;按照从大到小的顺序堆起宝塔。但彩虹圈不一定是按照直径的大小顺…
阅读更多...
Java NIO，高效操作I/O流的必备技能

Java NIO，高效操作I/O流的必备技能

Java IO在工作中其实不常用到&#xff0c;更别提NIO了。但NIO却是高效操作I/O流的必备技能&#xff0c;如顶级开源项目Kafka、Netty、RocketMQ等都采用了NIO技术&#xff0c;NIO也是大多数面试官必考的体系知识。虽然骨头有点难啃&#xff0c;但还是要慢慢消耗知识、学以致用哈…
阅读更多...
Spring核心容器总结

Spring核心容器总结

2.2 核心容器总结 2.2.1 容器相关 BeanFactory是IoC容器的顶层接口&#xff0c;初始化BeanFactory对象时&#xff0c;加载的bean延迟加载 ApplicationContext接口是Spring容器的核心接口&#xff0c;初始化时bean立即加载 ApplicationContext接口提供基础的bean操作相关方法…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023