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() ?所有的兄弟