跟着学之一选择器.docVIP

Jquery 选择器是最基本的操作了，当我们用原生的javascript的时候，我们为了选择一个对象不得不花费九头二虎之力， 有了Jquery的选择器，吃饭饭饭香，身体倍棒…… 1.基本 ?? ?我们知道jquery最常用的就是选择器了，我们看一下jqueryAPI中的 选择器—基本中有5种情况 class ,id ,element, *,还有一个多选择器，这里我们想一下css样式的写法 css样式也有几种情况：1.类样式 2.id样式 3.标签样式， 如果有一个aa的类 ，那么我们定义aa的样式就要写成? .aa{} 如果有一个bb的id，那么我们定义bb的样式就要写成 #bb{} 如果有标签div/div,那么我们定义的样式就写成 div{} 如果我们要定义所有的标签样式，那我们就写成 *{} （当然这样简写不太好） 如果我们要定义多个标签之类的就用分号来分开 比如 .aa,#bb,div{} 就定义了 class为aa，id为bb，标签为div的样式了。 我们看到上面5个如果 ，在和jquery的5个基本的选择器对比一下 如果我们要选择一个aa的类就写成 $(“.aa”) 如果我们要选择一个bb的id就写成$(“#bb”) 如果我们要选择div的标签就写成$(“div”) 如果我们要选择所有就写成 $(“*”) 如果我们要选择多个对象就写成 $ (“.aa,#bb,div”) ?对比一下，发现基本的选择器完全是按在css的语法在操作，是不是很容易呢 ? 2层次 ? 我们现在知道了上面5个选择器的写法之后，现在我们来考虑如果对层次做选择器， 先想一下什么是层次，其实说的就是 HTML的DOM结构 一层一层的，或者说XML的结构层次 ? 那我们就打开jquery的Api ，发现有4个关于层次的选择器。 ?归纳一下就是? a空格b，ab ，a+b，a~b 当然我这里只是为了少打几个字而已， ? 比如有如下的一个结构 ? div div class=bb span1spanspan2span /div span3span div class=”cc” /div span4span/div 我们现在想选择id为aa节点下所有的span节点 ，就用 $(“#aa span”) 我们现在想选择id为aa节点下第一层的span 就是span中文本为 3，4的两个，就用 $(“#aa span”) 我们现在想得到跟在class为bb后的那个span 就是span中文本为3的那个，就用$(“.bb+span”) 现在我们想得到class为bb后所有的span 就用$(“.bb~span”) 总结一下：第一个的写法还是css样式的写法一样 用空格表示节点下的元素 ????????? 第二个用来表示子节点，和空格不同的是它只作用在第一层 ????????? 第三个第四个都是用来表示跟随节点，只不过不同的是用+号表示紧接着的用~表示所有跟随的 我们是需要记住 (空格 + ~ )四个符号就可以了 ? 3简单 ? 我们知道了基本的选择器和层次的选择器，有时候我们选择出的是多个比如 ? ul li id=’aa’1/lili2/lili3/lili4/li/ul ? ???? ?我们想得到ul li的第一个（first） ，最后一个（last），基数行（odd），偶数行（even）匹配第三个（eq（2）），匹配大于2行（gt（1）），匹配小于第三行（lt（2）），这里说了7个那么我们要怎么来写这个选择器呢，比如匹配第一个$(“ul li:first”) ，匹配第三个$(“ul li:eq(2)”)? ,其他的就不写了 这里我们想一下css中 a链接的几种样式的的写法 a：hover a:link ……是不是一样呢 ????? 好了 这里我们看了7种，在看看api 还有3种是什么呢， 1 :not 去除所有与给定选择器匹配的元素 语法一样 $(“ul li:not(#aa)”) 意思是去掉在ul li里面的含有id为aa的元素元素 我们用$(“ul li”)能够得到4个li 用????? $(“ul li:not(#aa)”)就去掉了第一个li 只得到了三个 2:header 只是用来选择h1 h2 h3 ……这样的标题 3:animated匹配执行动画的元素 ? 还是总结一下，上面的这几个其实就是对已经选择出来的在一次的做筛选。建立在基础和层次上面。 ? 4 文本 可见性 ?继续往下看api，文本中有4个函数，当然功能还是对已经选择出来的内容做再次的筛选 ?上面是对节点的筛选，现在我们要对内容筛选 ? 1 divaxxiu/a /div2