Jquery
概念：一个JavaScript函数库(框架)。简化JS开发
* jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨 是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互
* JavaScript框架：本质就是一些js文件，封装了js的原生代码
分类：
1.：兼容ie678,使用最为广泛的，官方只做BUG维护，
功能不再新增。因此一般项目来说，使用1.x版本就可以了，
最终版本：1.12.4 (2016年5月20日)
2.：不兼容ie678，很少有人使用，官方只做BUG维护，
功能不再新增。如果不考虑兼容低版本的浏览器可以使用2.x，
最终版本：2.2.4 (2016年5月20日)
3.：不兼容ie678，只支持最新的浏览器。除非特殊要求，
一般不会使用3.x版本的，很多老的jQuery插件不支持这个版本。
目前该版本是官方主要更新维护的版本。最新版本：3.3.1（2018年1月20日)
JQuery对象和JS对象区别与转换：
1. JQuery对象在操作时，更加方便。
2 jQuery中选择器获取的是存储了HTML元素对象的数组
3. JQuery对象和js对象方法不通用的！！！！！
4. 两者相互转换
* jq -- > js : jq对象[索引] 或者 jq对象.get(索引) 即按照数组方式取
* js -- > jq : $(js对象)
5. this表示当前js对象，${this}表示当前jq对象
JQuery入口函数：
$(document).ready(function(){
// 执行代码
});
或者简写为：
$(function(){
// 执行代码
});
js入口函数：window.onload = function () {...}
区别：
jQuery 的入口函数是在 html 所有标签(DOM)都加载之后，就会去执行，可定义多次。
JavaScript 的 window.onload 事件是等到所有内容，包括外部图片之类的文件加载完后，才会执行，且只能定义一次，多次定义后边将前边覆盖。
# 选择器
所有选择器获取的都是标签数组，包括id选择器！！！
基本选择器
1. 标签选择器（元素选择器）
* 语法： $("html标签名") 获得所有匹配标签名称的元素
2. id选择器
* 语法： $("#id的属性值") 获得与指定id属性值匹配的元素
3. 类选择器
* 语法： $(".class的属性值") 获得与指定的class属性值匹配的元素
4. 并集选择器：
* 语法： $("选择器1,选择器2....") 获取多个选择器选中的元素之和
5. 全部选择器
* 语法： $("*") 获取此页面中的所有元素
层级选择器
1. 后代选择器
* 语法： $("A B ") 选择A元素内部的所有B元素
2. 子选择器
* 语法： $("A > B") 选择A元素内部的所有直接子元素B
3. 亲弟弟选择器
* 语法： $("A + B ") 选择紧接在A元素之后同级B元素
4. 弟弟选择器
* 语法： $("A ~ B") 选择A元素之后的所有同级B元素
属性选择器
1. 属性名称选择器
* 语法： $("A[属性名]") 包含指定属性的选择器
2. 属性选择器
* 语法： $("A[属性名='值']") 包含指定属性等于指定值的选择器
可选关系运算符：
!= :属性值不等于该值
^= :属性值以该值开头
$= :属性值以该值结尾
*= :属性值中包含该值
3. 复合属性选择器
* 语法： $("A[属性名='值'][]...") 包含多个属性条件的选择器,必须都符合
过滤选择器
过滤选择器的 ：前面为选择器范围，不写默认则为全部选择器 * ,冒号左右不要加空格
1. 首元素选择器
* 语法： :first 获得选择的元素中的第一个元素
2. 尾元素选择器
* 语法： :last 获得选择的元素中的最后一个元素
3. 非元素选择器
* 语法： :not(selector) 不包括指定内容的元素
4. 偶数选择器
* 语法： :even 索引为偶数，从 0 开始计数
5. 奇数选择器
* 语法： :odd 索引为奇数，从 0 开始计数
6. 等于索引选择器
* 语法： :eq(index) 指定索引元素，从0开始
7. 大于索引选择器
* 语法： :gt(index) 大于指定索引元素
8. 小于索引选择器
* 语法： :lt(index) 小于指定索引元素
9. 标题选择器
* 语法： :header 获得标题（h1~h6）元素，固定写法
10. 动画选择器
* 语法： :animated 获得正在执行动画效果的元素
11. 焦点选择器
* 语法： :focus 获得当前取得焦点的元素
内容过滤选择器
：前面为选择器范围，不写默认则为全部选择器 *
1. 内容包含选择器
* 语法： :contains(text) 获得选择的元素中的包含text的元素
2. 内容为空选择器
* 语法： :empty 获得选择的元素中的所有不包含子元素或者文本的空元素
3. 元素包含选择器
* 语法： :has(selector) 含有selector所匹配元素的元素，如：含有p标签的div标签 $("div:has(p)")
4. 有内容选择器
* 语法： :parent 与empty相对，选择有子标签或内容的元素
子元素过滤选择器
：前面为选择器范围，不写默认则为全部选择器 *
1. 首子元素选择器
* 语法： :first-child 获得选择的每个父元素中的第一个子元素
2. 指定首子元素选择器 jq1.9+
* 语法： E:first-child-type 获得子标签有E的父元素的第一个子元素E
3. 尾子元素选择器
* 语法： :last-child 每个父元素中的最后一个子元素
4. 指定尾子元素选择器 jq1.9+
* 语法： E:last-child-type 获得子标签有E的父元素的最后一个子元素E
5. 指定序号子元素选择器
* 语法：:nth-child(index)，选择父元素中第index个子元素，从1开始
6. 指定类型与序号子元素选择器
* 语法： E:nth-of-type(index)获得子标签有E的父元素的指定序号子元素E
7. 唯一子元素选择器
* 语法： :only-child 获取元素中只有唯一一个子元素(可以有文本)的父元素
8. 唯一指定子元素选择器
* 语法： E:only-of-type 只有唯一一个子元素且子元素为E的父元素
表单选择器
1. :input
2. :text
3. :password
4. :radio
5. :checkbox
6. :submit
7. :image
8. :reset
9. :button
10. :file
表单过滤选择器
1. 可用元素选择器
* 语法： :enabled 获得可用元素
2. 不可用元素选择器
* 语法： :disabled 获得不可用元素
3. 选中选择器
* 语法： :checked 获得单选/复选框选中的元素
4. 选中选择器
* 语法： :selected 获得下拉框选中的option元素
浙公网安备 33010602011771号