jQuery入门
https://www.cnblogs.com/clschao/articles/10093264.html
中文文档
简化编程
原生DOM的写法就是写JS代码，而以后我们多数都用jQuery来写，因为jQuery的优势很多，看上面，并且查找标签的方式有很多，比原生的DOM丰富的多，很便利，还有重要的一点就是不需要考虑浏览器的兼容性，因为jQuery做到了各大浏览器兼容的功能。
jQuery内容：
- 选择器
- 筛选器
- 样式操作
- 文本操作
- 属性操作
- 文档处理
- 事件
- 动画效果
- 插件
- each、data、Ajax
jquery 对象和dom对象
原生js 找到的 --dom对象
jquery 找到的对象--jQuery对象
dom对象只能使用dom对象方法.
jQuery对象只能使用自己的方法
装换:
1. dom 对象转jquery对象--jQuery对象[0]
$('#d1')[0]
2. jquery对象 转 dom 对象
$(dom对象)
$($('#d1')[0])
$('#d1').text('aaa')
基础语法
基本选择器（同css）
id选择器：
$("#id") #不管找什么标签，用什么选择器，都必须要写$("")，引号里面再写选择器，通过jQuery找到的标签对象就是一个jQuery对象，用原生JS找到的标签对象叫做DOM对象，看我们上面的jQuery对象部分的内容
标签选择器： id
$("tagName") $('div')
class选择器：
$(".className") $('.c1')
配合使用：
$("div.c1") // 找到有c1 class类的div标签
所有元素选择器：
$("*")
组合选择器：
$("#id, .className, tagName")
层级选择器：（同css）
x和y可以为任意选择器
$("x y");// x的所有后代y（子子孙孙）
$("x > y");// x的所有儿子y（儿子）
$("x + y")// 找到所有紧挨在x后面的y
$("x ~ y")// x之后所有的兄弟y
********************************
<div>
<h1>打打</h1>
<h1>打打</h1>
<h1>打打</h1>
</div>
*******************************
$('div h1')
$('div>h1')
$('h1+h1')
$('h1~h1')
基本筛选器（选择之后进行过滤）：
:first // 第一个
:last // 最后一个
:eq(index)// 索引等于index的那个元素
:even // 匹配所有索引值为偶数的元素，从 0 开始计数
:odd // 匹配所有索引值为奇数的元素，从 0 开始计数
:gt(index)// 匹配所有大于给定索引值的元素
:lt(index)// 匹配所有小于给定索引值的元素
:not(元素选择器)// 移除所有满足not条件的标签
:has(元素选择器)// 选取所有包含一个或多个标签在其内的标签(指的是从后代元素找)
例子
$('h1:first')
$('h1:last')
$('h1:eq(0)') 索引 支持负数
$('h1:eq(-1)') 倒数第一格
not $('h1:not(#hh)') 不包含id=hh 的
has
has
$("div:has(h1)")// 找到所有后代中有h1标签的div标签，意思是首先找到所有div标签，把这些div标签的后代中有h1的div标签筛选出来
$("div:has(.c1)")// 找到所有后代中有c1样式类（类属性class='c1'）的div标签
$("li:not(.c1)")// 找到所有不包含c1样式类的li标签
$("li:not(:has(a))")// 找到所有后代中不含a标签的li标签
后代有什么标签(后面)的 什么标签(前面)
选择器
选择器找到的是多个对象, 会放到数组里面, 但还是jquery 对象 能够直接使用jquery方法 但是这个是 设置的所有的
如果要单独设置某一个, 就把他摘出来(这时候拿到的是dom对象), 加一个$('')单独设置
例子 $($('.c1')[1]).text('bbb')
属性
[attribute]
[attribute=value]// 属性等于
[attribute!=value]// 属性不等于
$('[tittle='xx']')
input
// 示例,多用于input标签
<input type="text">
<input type="password">
<input type="checkbox">
$("input[type='checkbox']");// 取到checkbox类型的input标签
$("input[type!='text']");// 取到类型不是text的input标签
表单筛选器
找到的是input标签中 type对应的属性
:text
:password
:file
:radio
:checkbox
:submit
:reset
:button
例子
$(":checkbox")
$(":password")
表单对象属性筛选器
$(':disabled')
:enabled
:disabled
:checked
:selected
找到选中的option
<select id="s1">
<option value="beijing">北京市</option>
<option value="shanghai">上海市</option>
<option selected value="guangzhou">广州市</option>
<option value="shenzhen">深圳市</option>
</select>
$(":selected") // 找到所有被选中的option
$(":selected").text() 打印出来选中的文字
筛选器方法（将来用的很多）
向后找
$("#id").next()
$("#id").nextAll()
$("#id").nextUntil("#i2") #直到找到id为i2的标签就结束查找，不包含它
向前找
$("#id").prev()
$("#id").prevAll()
$("#id").prevUntil("#i2")
父亲元素
$("#id").parent()
$("#id").parents() // 查找当前元素的所有的父辈元素（爷爷辈、祖先辈都找到）
$("#id").parentsUntil('body') // 查找当前元素的所有的父辈元素，直到遇到匹配的那个元素为止，这里直到body标签，不包含body标签，基本选择器都可以放到这里面使用
儿子和兄弟
$("#id").children();// 儿子们
$("#id").siblings();// 兄弟们，不包含自己，.siblings('#id')，可以在添加选择器进行进一步筛选
查找 find 找子子孙孙
搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。
$("div").find("p")
等价于$("div p")
筛选 找所有div 标签
筛选出与指定表达式匹配的元素集合。这个方法用于缩小匹配的范围。用逗号分隔多个表达式。
$("div").filter(".c1") // 从结果集中过滤出有c1样式类的，从所有的div标签中过滤出有class='c1'属性的div，和find不同，find是找div标签的子子孙孙中找到一个符合条件的标签
和筛选一样 筛选在括号里面 下面的在括号外面
补充（和前面使用冒号的一样 :first等，只不过冒号的那个是写在选择器里面的，而下面的这几个是方法，如此而已，就不说啦）：
.first() // 获取匹配的第一个元素
.last() // 获取匹配的最后一个元素
.not() // 从匹配元素的集合中删除与指定表达式匹配的元素
.has() // 保留包含特定后代的元素，去掉那些不含有指定后代的元素。
.eq() // 索引值等于指定值的元素