1.jQuery基础铺垫
<!-- jquery是js的一个库，代码量没有那么冗余，先学jQuery基础的引入，然后动画，最后Ajax学一点，最后可以去书本目录上总结大纲，没有js那么难，学习压力一定会比较小。先敲代码，然后写案例+讲题 -->
<!-- jquery是js的一个库，代码量没有那么冗余，简洁、快速、轻量级 -->
<!-- 这学期用jQuery3.6的版本 -->
<!-- 1.下载和引入jQuery：
jQuery CDN的网址【https://releases.jquery.com/】
（1）代码直接引入：
<script
src="https://code.jquery.com/jquery-3.6.4.min.js"
integrity="sha256-oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl+cbzUq8="
crossorigin="anonymous"></script>
（2）打开这个网址，然后粘贴代码【https://code.jquery.com/jquery-3.6.4.min.js】
把全部的代码放到相同名字的jQuery的文件夹之下
-->
2.jquery的获取和引用
<!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标签，然后在同级目录下写（因为已经提前放好了js文件），应该会出现提示 --><!-- 这里的底层代码都是js结尾的，演变出了jQuery、vue等等 --><!-- 这个是最简单的引入方式，引入外部库之后才能写jQuery--><script src="jquery-3.6.4.min.js"></script>
</head>
<body><div>隐藏这个div</div><script>$('div').hide();// 这就是隐藏，代码量很短// $是jQuery特有标签，然后标签选择器选中，然后hide/*全局作用域下新增两个变量，$不需要实例化，是以类数组的方式存储，这里用的是jQuery对象，切记不能把$的jQuery对象和js的DOM对象混用。但是在实际开发中，其实这二者之间也可以转换：1.通过jQuery对象.[索引]或jQuery对象.get(索引)可把jQuery转dom对象2.而dom对象转换成jQuery对象的方法：$(DOM对象)*//*jQuery的选择器：格式：$(具体的选择器)--》通过选择器来获取元素：id 类 元素 如果同时获取多个元素，例如$(li,p,div)用，来分隔*/</script></body>
</html>3.jquery的选择器的小案例和应用
<!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="jquery-3.6.4.min.js"></script>
</head>
<body><div id="box">box</div><div class="fruit">苹果</div><div class="fruit">葡萄</div><p>段落</p><ul><li>11</li><li>22</li><li>33</li><li>44</li></ul><script>/*jQuery的选择器：格式：$(具体的选择器)--》通过选择器来获取元素：id 类 元素 如果同时获取多个元素，例如$(li,p,div)用，来分隔*/$('#box').hide();//先用$（id选择器）获取，然后后面.hide隐藏 #加id名是id选择器$('.fruit').hide();//.类名-->类选择器$('p').hide();//这是标签选择器// 这里把上面隐藏的显示出来// $('div,p').show();$('#box,.fruit,p').show();</script>
</body>
</html>