首页 前端知识 jQuery入门与常用API

jQuery入门与常用API

2024-08-04 00:08:24 前端知识 前端哥 613 285 我要收藏
2.2 jQuery 的入口函数

//第一种方式

$(document).ready(function(){

   ...  //  此处是页面DOM加载完成的入口

});




//第二种方式

$(function () {   

    ...  // 此处是页面 DOM 加载完成的入口

}) ; 



😆温馨提醒😆:

  1. 等着 DOM 结构渲染完毕即可执行内部代码,不必等到所有外部资源加载完成,jQuery 帮我们完成了封装;

  2. 相当于原生 js 中的 DOMContentLoaded;

  3. 不同于原生 js 中的 load 事件是等页面文档、外部的 js 文件、css文件、图片加载完毕才执行内部代码;

  4. 更推荐使用第二种方式;

2.3 jQuery 的顶级对象 $

1️⃣ $ 是 jQuery 的别称,在代码中可以使用 jQuery 代替 $,但一般为了方便,通常都直接使用 $

2️⃣ $ 是jQuery 的顶级对象, 相当于原生JavaScript中的 window。把元素利用$包装成jQuery对象,就可以调用jQuery 的方法;

2.4 jQuery 对象和 DOM 对象

1️⃣ 用原生 JS 获取来的对象就是 DOM 对象;

2️⃣ jQuery 方法获取的元素就是 jQuery 对象;

3️⃣ jQuery 对象本质是:利用$对DOM 对象包装后产生的对象(伪数组形式存储);

😆温馨提醒😆:只有 jQuery 对象才能使用 jQuery 方法,DOM 对象则使用原生的 JavaScirpt 方法;

4️⃣ DOM 对象与 jQuery 对象之间是可以相互转换的。因为原生js 比 jQuery 更大,原生的一些属性和方法 jQuery没有给我们封装. 要想使用这些属性和方法需要把jQuery对象转换为DOM对象才能使用。

👨 DOM 对象转换为 jQuery 对象:$(DOM对象)


$('div'); // $('div')是一个jQuery 对象

$('span'); // $('span')是一个jQuery 对象



👩 jQuery 对象转换为 DOM 对象(两种方式)


//第一种方式

$('div')[index]  // index 是索引号

//第二种方式

$('div').get(index)  // index 是索引号   




二、jQuery 常用API


(1)jQuery 选择器

1.1 jQuery 基础选择器

原生 JS 获取元素方式很多,很杂,而且兼容性情况不一致,因此 jQuery 给我们做了封装,使获取元素统一标准。


$("选择器")   // 里面选择器直接写 CSS 选择器即可,但是要加引号



| 名称 | 用法 | 描述 |

| — | — | — |

| ID选择器 | $(“#id”) | 获取指定ID的元素 |

| 全选选择器 | $(“*”) | 匹配所有元素 |

| 类选择器 | $(“.class”) | 获取同一类class的元素 |

| 标签选择器 | $(“div”) | 获取同一类标签的所有元素 |

| 并集选择器 | $(“div, p, li”) | 选取多个元素 |

| 交集选择器 | $(“li .current”) | 交集元素 |

1.2 jQuery 层级选择器

| 名称 | 用法 | 描述 |

| — | — | — |

| 子代选择器 | $(“ul>li”); | 使用>号,获取亲儿子层级的元素;注意:并不会获取孙子层级的元素; |

| 后代选择器 | $(“ul li”) | 使用空格,代表后代选择器,获取ul下的所有li元素,包括孙子等; |

1.3 隐式迭代(重要)

遍历内部 DOM 元素(伪数组形式存储)的过程就叫做隐式迭代

简单理解:给匹配到的所有元素进行循环遍历,执行相应的方法,而不用我们再进行循环,简化我们的操作,方便我们调用。

完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script src="jquery.min.js"></script>

</head>



<body>

    <div>人间没有单纯的快乐,快乐总夹带着烦恼和忧虑。</div>

    <div>人间没有单纯的快乐,快乐总夹带着烦恼和忧虑。</div>

    <div>人间没有单纯的快乐,快乐总夹带着烦恼和忧虑。</div>

    <div>人间没有单纯的快乐,快乐总夹带着烦恼和忧虑。</div>

    <ul>

        <li>欢迎来到我的博客哦!</li>

        <li>欢迎来到我的博客哦!</li>

        <li>欢迎来到我的博客哦!</li>

    </ul>

    <script>

        // 1. 获取四个div元素 

        console.log($("div"));

        // 2. 给四个div设置背景颜色为粉色 jquery对象不能使用style

        $("div").css("background", "pink");

        // 3. 隐式迭代就是把匹配的所有元素内部进行遍历循环,给每一个元素添加css这个方法

        $("ul li").css("color", "red");

    </script>

</body>



</html>



1.4 jQuery 筛选选择器

| 语法 | 用法 | 描述 |

| — | — | — |

| :first | $(“li:first”) | 获取第一个li元素 |

| :last | $(“li:last”) | 获取最后一个li元素 |

| :eq(index) | $(“li:eq(2)”) | 获取到的li元素中,选择索引号为2的元素,索引号index从0开始 |

| :odd | $(“li:odd”) | 获取到的li元素中,选择索引号为奇数的元素 |

| :even | $(“li:even”) | 获取到的li元素中,选择索引号为偶数的元素 |

完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script src="jquery.min.js"></script>

</head>



<body>

    <ul>

        <li>活在这珍贵的人间,太阳强烈,水波温柔。</li>

        <li>活在这珍贵的人间,太阳强烈,水波温柔。</li>

        <li>活在这珍贵的人间,太阳强烈,水波温柔。</li>

        <li>活在这珍贵的人间,太阳强烈,水波温柔。</li>

        <li>活在这珍贵的人间,太阳强烈,水波温柔。</li>

    </ul>

    <ol>

        <li>欢迎来到我的博客哦!</li>

        <li>欢迎来到我的博客哦!</li>

        <li>欢迎来到我的博客哦!</li>

        <li>欢迎来到我的博客哦!</li>

        <li>欢迎来到我的博客哦!</li>

        <li>欢迎来到我的博客哦!</li>

    </ol>

    <script>

        $(function() {

            $("ul li:first").css("color", "red");

            $("ul li:eq(2)").css("color", "blue");

            $("ol li:odd").css("color", "skyblue");

            $("ol li:even").css("color", "pink");

        })

    </script>

</body>



</html>



1.5 jQuery 筛选方法(重点)

| 语法 | 语法 | 说明 |

| — | — | — |

| parent() | $(“li”).parent(); | 查找父级 |

| children(selector) | ( “ u l ” ) . c h i l d r e n ( “ l i ” ) ; ∣ 相对于 (“ul”).children(“li”); | 相对于 (ul).children(li);相对于(“ul>li”),最近一级(亲儿子) |

| find(selector) | ( “ u l ” ) . f i n d ( “ l i ” ) ; ∣ 相对于 (“ul”).find(“li”); | 相对于 (ul).find(li);相对于(“ul li”),后代选择器 |

| siblings(selector) | $(“.first”).siblings(“li”); | 查找兄弟节点,不包括自己本身 |

| next[(expr)] | $(“first”).nextAll(); | 查找当前元素之后所有的同辈元素 |

| prevAll([expr]) | $(“.last”).prevAll() | 查找当前元素之前所有的同辈元素 |

| hasClass(class) | $(“div”).hasClass(“protected”) | 检查当前的元素是否含有某个特定的类,如果有,则返回true。 |

| eq(index) | ( “ l i ” ) . e q ( 2 ) ∣ 相对于 (“li”).eq(2) | 相对于 (li).eq(2)相对于(“li:eq(2),index,从0开始”) |

1.6 jQuery 里面的排他思想

想要多选一的效果,排他思想:当前元素设置样式,其余的兄弟元素清除样式。

完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script src="jquery.min.js"></script>

</head>



<body>

    <button>库里</button>

    <button>库里</button>

    <button>库里</button>

    <button>库里</button>

    <button>库里</button>

    <script>

        $(function () {

            // 1. 隐式迭代 给所有的按钮都绑定了点击事件

            $("button").click(function () {

                // 2. 当前的元素变化背景颜色

                $(this).css("background", "pink");

                // 3. 其余的兄弟去掉背景颜色 隐式迭代

                $(this).siblings("button").css("background", "");

            });

        })

    </script>

</body>



</html>



1.7 链式编程

链式编程是为了节省代码量,看起来更优雅。

完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script src="jquery.min.js"></script>

</head>



<body>

    <button>库里</button>

    <button>库里</button>

    <button>库里</button>

    <button>库里</button>

    <button>库里</button>

    <script>

        $(function () {

            // 1. 隐式迭代 给所有的按钮都绑定了点击事件

            $("button").click(function () {

                 // 2. 我的颜色为红色, 我的兄弟的颜色为空

                $(this).css("color", "red").siblings().css("color", "");

            });

        })

    </script>

</body>



</html>




(2)jQuery 样式操作

2.1 操作 css 方法

jQuery 可以使用 css 方法来修改简单元素样式;也可以操作类,修改多个样式。

1️⃣ 参数只写属性名,则是返回属性值;


$(this).css("color");



2️⃣ 参数是属性名,属性值,逗号分隔,是设置一组样式,属性必须加引号,值如果是数字可以不用跟单位和引号;


$(this).css("color", "red");



3️⃣ 参数可以是对象形式,方便设置多组样式。属性名和属性值用冒号隔开, 属性可以不用加引号;


$(this).css({"color":"white","font-size":"20px"});



完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script src="jquery.min.js"></script>

    <style>

        div {

            width: 200px;

            height: 200px;

            background-color: pink;

        }

    </style>

</head>



<body>

    <div></div>

    <script>

        // 操作样式之css方法

        $(function() {

            console.log($("div").css("width"));

            $("div").css({

                width: 400,

                height: 400,

                backgroundColor: "red"

                // 如果是复合属性则必须采取驼峰命名法,如果值不是数字,则需要加引号

            })

        })

    </script>

</body>



</html>



2.2 设置类样式方法

作用等同于以前的 classList,可以操作类样式, 注意操作类里面的参数不要加点。

1️⃣ 添加类


$("div").addClass("current");  // addClass相当于追加类名 不影响以前的类名



2️⃣ 移除类


$("div").removeClass("current");



3️⃣ 切换类


$("div").toggleClass("current");



完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

        div {

            width: 150px;

            height: 150px;

            background-color: pink;

            margin: 100px auto;

            transition: all 0.5s;

        }

        

        .current {

            background-color: red;

            transform: rotate(360deg);

        }

    </style>

    <script src="jquery.min.js"></script>

</head>



<body>

    <div class="current"></div>

    <script>

        $(function() {

            // 1. 添加类 addClass()

            // $("div").click(function() {

            //     // $(this).addClass("current");

            // });

            

            // 2. 删除类 removeClass()

            // $("div").click(function() {

            //     $(this).removeClass("current");

            // });

            

            // 3. 切换类 toggleClass()

            $("div").click(function() {

                $(this).toggleClass("current");

            });

        })

    </script>

</body>



</html>



2.3 类操作与className区别

1️⃣ 原生 JS 中 className 会覆盖元素原先里面的类名。

2️⃣ jQuery 里面类操作只是对指定类进行操作,不影响原先的类名。


(3)jQuery 效果

jQuery 给我们封装了很多动画效果,最为常见的如下:

3.1 显示隐藏效果

1️⃣ 显示语法规范


show([speed,[easing],[fn]])



2️⃣ 隐藏语法规范


hide([speed,[easing],[fn]])



3️⃣ 切换语法规范


toggle([speed,[easing],[fn]])



😆温馨提醒😆:

  1. 参数都可以省略, 无动画直接显示;

  2. speed:三种预定速度之一的字符串(“slow”,“normal”, or “fast”)或表示动画时长的毫秒数值(如:1000);

  3. easing:(Optional) 用来指定切换效果,默认是“swing”,可用参数“linear”;

  4. fn: 回调函数,在动画完成时执行的函数,每个元素执行一次;

😆建议😆:平时一般不带参数,直接显示隐藏即可;

完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

        div {

            width: 150px;

            height: 300px;

            background-color: pink;

        }

    </style>

    <script src="jquery.min.js"></script>

</head>



<body>

    <button>显示</button>

    <button>隐藏</button>

    <button>切换</button>

    <div></div>

    <script>

        $(function() {

            $("button").eq(0).click(function() {

                $("div").show(1000, function() {

                });

            })

            $("button").eq(1).click(function() {

                $("div").hide(1000, function() {

                });

            })

            $("button").eq(2).click(function() {

                    $("div").toggle(1000);

                })

            // 一般情况下,我们都不加参数直接显示隐藏就可以了

        });

    </script>

</body>



</html>



3.2 滑动效果

1️⃣ 下滑效果语法规范


slideDown([speed,[easing],[fn]])



2️⃣ 上滑效果语法规范


slideUp([speed,[easing],[fn]])



3️⃣ 滑动切换效果语法规范


slideToggle([speed,[easing],[fn]])



😆温馨提醒😆:

  1. 参数都可以省略, 无动画直接显示;

  2. speed:三种预定速度之一的字符串(“slow”,“normal”, or “fast”)或表示动画时长的毫秒数值(如:1000);

  3. easing:(Optional) 用来指定切换效果,默认是“swing”,可用参数“linear”;

  4. fn: 回调函数,在动画完成时执行的函数,每个元素执行一次;

完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

        div {

            width: 150px;

            height: 300px;

            background-color: pink;

            display: none;

        }

    </style>

    <script src="jquery.min.js"></script>

</head>



<body>

    <button>下拉滑动</button>

    <button>上拉滑动</button>

    <button>切换滑动</button>

    <div></div>

    <script>

        $(function() {

            $("button").eq(0).click(function() {

                // 下滑动 slideDown()

                $("div").slideDown();

            })

            $("button").eq(1).click(function() {

                // 上滑动 slideUp()

                $("div").slideUp(500);

            })

            $("button").eq(2).click(function() {

                // 滑动切换 slideToggle()

                $("div").slideToggle(500);

            });

        });

    </script>

</body>



</html>



3.3 事件切换

hover([over,]out)



(1)over:鼠标移到元素上要触发的函数(相当于mouseenter);

(2)out:鼠标移出元素要触发的函数(相当于mouseleave);

(3)如果只写一个函数,则鼠标经过和离开都会触发它;

3.4 动画队列及其停止排队方法

1️⃣ 动画或效果队列:动画或者效果一旦触发就会执行,如果多次触发,就造成多个动画或者效果排队执行。

2️⃣ 停止排队


stop()



😆温馨提醒😆:

  1. stop() 方法用于停止动画或效果;

  2. stop() 写到动画或者效果的前面,相当于停止结束上一次的动画;

代码演示如下:


$(this).children("ul").stop().slideToggle();



3.5 淡入淡出效果

1️⃣ 淡入效果语法规范


fadeIn([speed,[easing],[fn]])



2️⃣ 淡出效果语法规范


fadeOut([speed,[easing],[fn]])



3️⃣ 淡入淡出切换效果语法规范


fadeToggle([speed,[easing],[fn]])



4️⃣ 渐进方式调整到指定的不透明度


fadeTo([[speed],opacity,[easing],[fn]])



😆温馨提醒😆:

1.opacity 透明度必须写,取值 0~1 之间。

2. speed:三种预定速度之一的字符串(“slow”,“normal”, or “fast”)或表示动画时长的毫秒数值(如:1000)。必须写

3. easing:(Optional) 用来指定切换效果,默认是“swing”,可用参数“linear”。

4. fn: 回调函数,在动画完成时执行的函数,每个元素执行一次。

完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

        div {

            width: 150px;

            height: 300px;

            background-color: pink;

            display: none;

        }

    </style>

    <script src="jquery.min.js"></script>

</head>



<body>

    <button>淡入效果</button>

    <button>淡出效果</button>

    <button>淡入淡出切换</button>

    <button>修改透明度</button>

    <div></div>

    <script>

        $(function() {

            $("button").eq(0).click(function() {

                // 淡入 fadeIn()

                $("div").fadeIn(1000);

            })

            $("button").eq(1).click(function() {

                // 淡出 fadeOut()

                $("div").fadeOut(1000);

            })

            $("button").eq(2).click(function() {

                // 淡入淡出切换 fadeToggle()

                $("div").fadeToggle(1000);

            });

            $("button").eq(3).click(function() {

                //  修改透明度 fadeTo() 这个速度和透明度要必须写

                $("div").fadeTo(1000, 0.5);

            });

        });

    </script>

</body>



</html>



3.6 自定义动画 animate

1️⃣ 语法


animate(params,[speed],[easing],[fn])



2️⃣ 参数

  1. params: 想要更改的样式属性,以对象形式传递,必须写。 属性名可以不用带引号, 如果是复合属性则需要采取驼峰命名法 borderLeft。其余参数都可以省略;

  2. speed:三种预定速度之一的字符串(“slow”,“normal”, or “fast”)或表示动画时长的毫秒数值(如:1000);

  3. easing:(Optional) 用来指定切换效果,默认是“swing”,可用参数“linear”;

  4. fn: 回调函数,在动画完成时执行的函数,每个元素执行一次;

完整代码演示如下:


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script src="jquery.min.js"></script>

    <style>

        div {

            position: absolute;

            width: 200px;

            height: 200px;

            background-color: pink;

        }

    </style>

</head>



<body>

    <button>动起来</button>

    <div></div>

    <script>

        $(function() {

            $("button").click(function() {

                $("div").animate({

                    left: 500,

                    top: 300,

                    opacity: .4,

                    width: 500

                }, 500);

            })

        })

    </script>

</body>



</html>




(4)jQuery 属性操作

4.1 设置或获取元素固有属性值 prop()

所谓元素固有属性就是元素本身自带的属性,比如<a>元素里面的 href ,比如<input>元素里面的 type。

1️⃣ 获取属性语法


prop("属性")



2️⃣ 设置属性语法


prop("属性", "属性值")



4.2 设置或获取元素自定义属性值 attr()

用户自己给元素添加的属性,我们称为自定义属性。 比如给 div 添加 index =“1”;

1️⃣ 获取属性语法


attr("属性")  // 类似原生 getAttribute()



2️⃣ 设置属性语法


attr("属性", "属性值")  // 类似原生 setAttribute()



4.3 数据缓存 data()

data() 方法可以在指定的元素上存取数据,并不会修改 DOM 元素结构。一旦页面刷新,之前存放的数据都将被移除。

1️⃣ 附加数据语法


data("name","value")   // 向被选元素附加数据



2️⃣ 获取数据语法


date("name")  //   向被选元素获取数据



4.4 完整代码演示

<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script src="jquery.min.js"></script>

</head>



<body>

    <a href="https://blog.csdn.net/battledao?spm=1011.2124.3001.5343" title="欢迎来到我的博客哦!">欢迎来到我的博客哦!</a>

    <input type="checkbox" name="" id="" checked>

    <div index="1" data-index="2">我是div</div>

#  最后

**自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。**

**深知大多数初中级Android工程师,想要提升技能,往往是自己摸索成长,自己不成体系的自学效果低效漫长且无助。**

**因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。**

![img](https://img-blog.csdnimg.cn/img_convert/655925ece59e615b42c9326681388473.jpeg)

![](https://img-blog.csdnimg.cn/img_convert/ac7ce661d5dba9a08b4097096ba18246.png)

![](https://img-blog.csdnimg.cn/img_convert/b68010227c3be080a6c033d568cc6f99.png)

**既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上Android开发知识点!不论你是刚入门Android开发的新手,还是希望在技术上不断提升的资深开发者,这些资料都将为你打开新的学习之门!**

[**如果你觉得这些内容对你有帮助,需要这份全套学习资料的朋友可以戳我获取!!**](https://bbs.csdn.net/topics/618191877)

**由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!**

prop("属性", "属性值")



4.2 设置或获取元素自定义属性值 attr()

用户自己给元素添加的属性,我们称为自定义属性。 比如给 div 添加 index =“1”;

1️⃣ 获取属性语法


attr("属性")  // 类似原生 getAttribute()



2️⃣ 设置属性语法


attr("属性", "属性值")  // 类似原生 setAttribute()



4.3 数据缓存 data()

data() 方法可以在指定的元素上存取数据,并不会修改 DOM 元素结构。一旦页面刷新,之前存放的数据都将被移除。

1️⃣ 附加数据语法


data("name","value")   // 向被选元素附加数据



2️⃣ 获取数据语法


date("name")  //   向被选元素获取数据



4.4 完整代码演示

<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <script src="jquery.min.js"></script>

</head>



<body>

    <a href="https://blog.csdn.net/battledao?spm=1011.2124.3001.5343" title="欢迎来到我的博客哦!">欢迎来到我的博客哦!</a>

    <input type="checkbox" name="" id="" checked>

    <div index="1" data-index="2">我是div</div>

#  最后

**自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。**

**深知大多数初中级Android工程师,想要提升技能,往往是自己摸索成长,自己不成体系的自学效果低效漫长且无助。**

**因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。**

[外链图片转存中...(img-yIzTFb4A-1714925134444)]

[外链图片转存中...(img-kc5UOcVp-1714925134444)]

[外链图片转存中...(img-LD2WhCBf-1714925134445)]

**既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上Android开发知识点!不论你是刚入门Android开发的新手,还是希望在技术上不断提升的资深开发者,这些资料都将为你打开新的学习之门!**

[**如果你觉得这些内容对你有帮助,需要这份全套学习资料的朋友可以戳我获取!!**](https://bbs.csdn.net/topics/618191877)

**由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!**
转载请注明出处或者链接地址:https://www.qianduange.cn//article/14720.html
标签
评论
发布的文章

RapidJSON介绍

2024-08-14 00:08:38

jQuery 4 beta 震撼发布

2024-08-14 00:08:36

cJSON的使用

2024-08-14 00:08:36

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!