jQuery基础
为什么要用jquery？
写起来简单，省事，开发效率高，兼容性好
write less do more
什么是jQuery?
- jQuery是一个兼容多浏览器的JavaScript库（类似python里面的模块）;
- 轻量级的js库，压缩后只有21k
如何使用jQuery？
1、导入: <script src="jquery-3.2.1.js"></script>或者<script src="jquery-3.2.1.min.js"></script>
2、语法规则：$(selector).action();, 找到标签并操作;
jQuery知识点
html:裸体的人
css:穿了衣服的人
JS：让人动起来
jQuery对象：
用jQuery选择器查出来的就是jQuery对象,jQuery对象，他就可以使用jQuery方法，不能使用DOM的方法;
jQuery选择器
基本选择器
内部原理与js基本一致，格式：$("selector");
ID选择器 $("#id的值")
类选择器（class） $(".class的值")
标签选择器(html标签) $("标签的名字")
所有标签 $("*")
# 直接找到class为d1的所有标签，随后直接对其操作css样式,相比于js需要用for循环，运用jQuery可以一步到位,只适用于批量处理相同的事件
$(".d1").css({"color": "red", "font-size": "50px"})组合选择器
从一个标签的子子孙孙去找 $("父亲 子子孙孙")
从一个标签的儿子里面找 $("父亲 > 儿子标签")
找紧挨着的标签 $("标签 + 下面紧挨着的那个标签")
找后面所有同级的 $("标签 ~ 兄弟")基本筛选器
主要对一组标签进行操作;
$(" :first") 找第一个
$(" :not(‘‘)") 不是/非
$("#i1>input":not(‘.c1,.c2‘))
$(" :even") 偶数
$(" :odd") 奇数
$(" :eq(index)") 找等于index的
$(" :gt(index)") 找大于index的
$(" :lt(index)") 找小于index的
$(" :last") 最后一个
$(" :focus") 焦点过滤筛选器
效果和基本筛选器相同，但是推荐这个方法，更为灵活，可以应用变量操作;
$("").first() 找第一个
$("").parent() 找父亲
$("").eq(index) 找等于index的
.hasClass() 判断有没有某个类的属性筛选
$("[con]").css("color", "blue")
# 找有con属性的标签对象并修改字体颜色
$("[con=d1]").css("color", "blue")
# 找有con属性且值为d1的标签对象并修改字体颜色
$("[con][class]").css("color", "blue")
# 定位同时具有con和class属性的标签对象并修改样式input表单筛选器
:input
:password
:checkbox
:radio
:submit
:button
:image
:file查找筛选器
类似于js中的导航查询标签, 链式操作
# 查找子标签
$("div").children(".text") // 找所有的子代
$("div").find(".test") // 找所有的后代
# 向下查找兄弟标签
$("div").next() //下一个的同级的标签， 可以连续使用, 中间可以存在css等样式操作
$("div").nextAll() //下面所有的
$("div").nextUntil("#d1") //找下面的直到找到某个标签为止,只取中间的标签，两边的不操作
# 查找父标签
$("div").parent() // 只找父亲,用的不较多
$("div").parents() //找所有的父亲,用的很少
$("div").parentsUntil() //直到找到你要找的那个父亲为止
# 向上查找兄弟标签
$("div").prev() //上面的
$("div").prevAll() //上面的所有
$("div").prevUntil(".c1") //上面的直到找到某个标签为止,定位中间所有的标签对象
# 查找所有兄弟标签
$("").siblings() 所有的兄弟