jQueryjquery的选择器275

　　知识点概述
　　jQuery的选择器与CSS的选择器几乎相同,一次努力学习付出两份丰厚收获
　　jQuery 选择器按照功能主要分为＂选择＂与＂过滤＂两种选择器
　　1) 本节主要学习的3个分类 1)基础选择器 2)层次选择器 3)表单选择器
　　1,3这种两种类型必须理解掌握,在之后学习的ASP.Net的前端网页中常用
　　2) 理解掌握jQuery选择器,通过其快速找到指定的jQuery对象(一个或一组)
　　3) 回顾并对照javascript选择器 通过jQuery选择器获取jQuery对象,使用js代码实现同等功能
　　1) 基础选择器 分为:id,类名,标签 ,组合与通配符*;JQ与JS实现代码对照着记忆
　　1.1 通过id获取对象
　　注意: 即使页面中有多个相同的id号,JQ与JS的操作都只对第一个元素有效
　　但是: CSS却对具有相同id的元素设置其样式时有效,可以自己测试一下   
　　1.2 通过类名获取对象   //通过js方式   var jsdv = document.getElementsByClassName(＂dv2＂);    console.log(jsdv);//得到js对象   //通过JQ方式   var jqdv = $(＂.dv2＂);    console.log(jqdv);//得到JQ对象
　　1.3 通过标签名称获取对象  //通过js方式  var jsdv = document.getElementsByTagName(＂p＂);   console.log(jsdv);//得到js对象 //通过JQ方式    var jqdv = $(＂p＂);   console.log(jqdv);//得到JQ对象
　　1.4 通过组合选择器获取对象 选择器中 每项通过逗号分隔
　　注意: 使用此选择器可以得到1)同一种标签比如都是p 2)不同标签比如p与span//通过组合方式   console.log(＂使用组合选择器＂); //通过JQ方式 var jqdv = $(＂#dv1,.dv2,span＂); //里面有id 类名 与标签三种选择器  console.log(jqdv);//得到JQ对象
　　1.5 通过通配符*获取所有对象console.log(＂使用通配符选择器＂); //通过JQ方式 var jqdv = $(＂*＂); console.log(jqdv);//得到JQ对象
　　各个选择器的结果
　　最主要是牢记前三个常用的,后两个知道即可                                       1          2                  
　　2) 层次选择器 分为:子孙类(空格),子类(>),其它兄弟(~),紧挨的兄弟(+)
　　回顾下Dom树节点的关系( 只有父子关系 ) 牢记一句话:父子看深度,兄弟看索引
　　只要弄懂两点即可豁然开朗;快速理清它们的关系,更便于灵活掌握运用层次选择器的精髓,以家庭举例说明Dom树节点的关系
　　1)深度: 相对于根节点而言,以下图的p2,p3,p4为例,其深度为1,它们的关系为兄弟节点;它们相当于p1的儿子;p5到p10相当于p1的孙子(在Dom节点的关系中没有此概念)
　　2)索引: 相对于父节点而言( 索引都是从0开始 ),以下图的p2与p5为例,p2与p5的索引为0,都是家庭的大儿子,不能因此说它们是兄弟关系,因为p5与p2深度不同(差了一辈),所以它们是父子关系的节点
　　文档结构及Dom树图示
　　2.1 获取其子孙辈元素  使用 空格 隔开 //获取当前节点下所有的子孙辈元素 var jqdv = $(＂#dv1 p＂); //获取p1下的所有元素 console.log(jqdv); //结果为p2到p10共有9个元素
　　上面的子孙辈的是一个扩展概念即下面的重孙...穷尽所有符合条件的元素
　　2.2 只获取子辈元素 使用 > 隔开//只获取当前节点下的儿子辈元素 var jqdv = $(＂#dv1>p＂) console.log(jqdv);//结果为p2,p3,p4的 3个元素
　　2.3 获取当前元素后面的兄弟元素 使用 ~ 隔开//只获取当前节点后面的兄弟元素 var jqdv = $(＂.dv2~p＂) //~ 这个符合一般在tab键上面 shift+~即可打出 console.log(jqdv); //结果为p3,p4的 2个元素
　　2.4 获取当前元素指定紧挨的兄弟一个元素 使用 + 隔开//只获取当前节点紧挨着的兄弟元素 var jqdv = $(＂.dv2+p＂) console.log(jqdv); //结果为p3的 1个元素
　　归纳总结按获取元素范围排位:1) 获取所有元素使用空格  2) 获取儿子元素使用>  3)获取后面所有兄弟元素使用 ~  4)获取紧挨兄弟元素使用 +                                                                     11                          6                               7             8                               9             10                
　　3) 表单选择器
　　常见表单元素
　　3.1 表单的作用
　　在网页中主要负责前端数据的采集功能,就是采集用户输入的信息,通过