一：什么是jquery
jQuery是一个快速、简洁的JavaScript框架。
它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。也可以将jQuery库下载到本地，然后引入本地的jQuery库。也可以直接引入外网资源。
（1）：操作dom元素，给它添加点内容，加背景色，加颜色，加边框，加点击事件
原生js：
jquery：
$ => jQuery对象
$(选择器)，获取dom元素，注意：这里返回的是被jquery封装过后的元素。
html()方法，操作dom的html内容。
css()方法，操作dom的样式。
click()方法，设置点击事件
（2）：jquery选择器
全局选择器
$('*').css('font-size','30px')
标签选择器
$('h2').css('color','red')
类选择器
$('.one').css('text-decoration','underline')
id选择器，注意：如果id值相同，只能获取第一个元素
$('#two').css('color','green')
后代选择题
$('#three .one').css('background-color','lightblue')
属性选择器
$('p[name="nj"]').css('border','1px solid blue')
在css中选择器怎么写，在jQuery中选择器就怎么写
jQuery就是通过各种选择器，获取对应的dom元素，如果获取的是多个dom元素，不需要遍历元素就可以操作元素。
（3）：jquery获取元素的方法
使用jquery选择器返回的对象是一个集合
let five = $('#five')
prev()方法，返回同级的上一个元素
five.prev().css('color','red')
five.prev().prev().css('color','green')
prevAll()方法，返回同级的上面所有元素
注意：方法里面还可以继续添加选择器，针对指定的元素
five.prevAll('li').css('background-color' ,'lightblue')
next()方法，返回同级的下一个元素
five.next().css('color','blue')
相邻的下一个li元素
$('#five+li').css('color','blue')
five.next().next().css('color','pink')
nextAll()方法，返回同级的下面所有元素
five.nextAll('li').css('background-color','lightgreen')
相邻的下面所有li元素
$('#five~li').css('background-color','lightgreen')
siblings()方法，返回同级的所有元素
five.siblings().css('font-weight','bold')
parent()方法，获取父级元素
five.parent().css('border','1px solid black')
children()方法，获取所有的子元素
five.parent().children('p').css('background-color','lightYellow')
five.parent().parent().css('border','1px solid red')
parents()方法，默认是获取所有的父级元素，所有在使用该方法时，需要添加选择器
five.parents('.a').css('border','1px solid blue')
（4）：显示和隐藏方法
<button id="show">显示</button>
<button id="hide">隐藏</button>
<button id="toggle">显示/隐藏</button>
<button id="slideDown">下拉显示</button>
<button id="slideUp">上拉隐藏</button>
<button id="slideToggle">下拉显示/上拉隐藏</button>
<button id="fadeIn">淡入</button>
<button id="fadeOut">淡出</button>
<button id="fadeToggle">淡入/淡出</button>
<button id="block">css显示</button>
<button id="none">css隐藏</button>
（5）：js对象和jquery对象之间的转换
二、jquery-ajax
（1）：选项卡效果
原生js：
jQuery：
（2）：一级导航效果
（2）：二级导航效果
（3）：三级导航效果
