JAVAScript强大的框架：Jquery（二）

一 可见度过滤选择器

可见度过滤选择器是根据元素的可见和不可见状态来选择相应的元素

一、:hidden用法: $(”tr:hidden”)  返回值  集合元素

     说明: 匹配全部的不可见元素，input 元素的 type 属性为 “hidden” 的话也会被匹配到.意思是css中display:none和input type=”hidden”的都会被匹配到.一样,要在脑海中完全分清楚冒号”:”, 点号”.”和逗号”,”的区别.

二、:visible用法: $(”tr:visible”)  返回值  集合元素

    说明: 匹配全部的可见元素.

属性过滤选择器

属性过滤选择器的过滤规则是经过元素的属性来获取相应的元素

一、[attribute]用法: $(”div[id]“) ;  返回值  集合元素

      说明: 匹配包含给定属性的元素. 例子中是选取了全部带”id”属性的div标签.

二、[attribute=value]用法: $(”input[name='newsletter']“).attr(”checked”, true);    返回值  集合元素

      说明: 匹配给定的属性是某个特定值的元素.例子中选取了全部 name 属性是 newsletter 的 input 元素.

三、[attribute!=value]用法: $(”input[name!='newsletter']“).attr(”checked”, true);    返回值  集合元素

      说明: 匹配全部不含有指定的属性，或者属性不等于特定值的元素.此选择器等价于:not([attr=value]),要匹配含有特定属性但不等于特定值的元素,请使用[attr]:not([attr=value]).以前看到的 :not 派上了用场.

四、[attribute^=value]用法: $(”input[name^=‘news’]“)  返回值  集合元素 

      说明: 匹配给定的属性是以某些值开始的元素.嗯,咱们又见到了这几个相似于正则匹配的符号.如今想忘都忘不掉了吧?!

五、[attribute$=value]用法: $(”input[name$=‘letter’]“)  返回值  集合元素 

     说明: 匹配给定的属性是以某些值结尾的元素.

六、[attribute*=value]用法: $(”input[name*=‘man’]“)   返回值  集合元素

     说明: 匹配给定的属性是以包含某些值的元素.

七、[attributeFilter1][attributeFilter2][attributeFilterN]用法: $(”input[id][name$=‘man’]“)  返回值  集合元素

     说明: 复合属性选择器,须要同时知足多个条件时使用.又是一个组合,这种状况咱们实际使用的时候很经常使用.这个例子中选择的是全部含有 id 属性,而且它的 name 属性是以 man 结尾的元素.

二 子元素过滤选择器

一、:nth-child(index/even/odd/equation)用法: $(”ul li:nth-child(2)”)   返回值  集合元素

      说明: 匹配其父元素下的第N个子或奇偶元素.这个选择器和以前说的基础过滤(Basic Filters)中的 eq() 有些相似,不一样的地方就是前者是从0开始,后者是从1开始.

二、:first-child用法: $(”ul li:first-child”)    返回值  集合元素 

      说明: 匹配第一个子元素.’:first’ 只匹配一个元素,而此选择符将为每一个父元素匹配一个子元素.这里须要特别点的记忆下区别.

三、:last-child用法: $(”ul li:last-child”)      返回值  集合元素

      说明: 匹配最后一个子元素.’:last’只匹配一个元素,而此选择符将为每一个父元素匹配一个子元素.

 四、: only-child用法: $(”ul li:only-child”)   返回值  集合元素 

      说明: 若是某个元素是父元素中惟一的子元素,那将会被匹配.若是父元素中含有其余元素,那将不会被匹配.意思就是:只有一个子元素的才会被匹配!

三 表单对象属性过滤选择器

此选择器主要对所选择的表单元素进行过滤

一、:enabled用法: $(”input:enabled”)    返回值  集合元素

      说明: 匹配全部可用元素.意思是查找全部input中不带有disabled=”disabled”的input.不为disabled,固然就为enabled啦.

二、:disabled用法: $(”input:disabled”)    返回值  集合元素

      说明: 匹配全部不可用元素.与上面的那个是相对应的.

三、:checked用法: $(”input:checked”)   返回值  集合元素

      说明: 匹配全部选中的被选中元素(复选框、单选框等，不包括select中的option).这话提及来有些绕口.

四、:selected用法: $(”select option:selected”)   返回值  集合元素

       说明: 匹配全部选中的option元素.

四 表单选择器

一、:input用法: $(”:input”) ;   返回值  集合元素

      说明:匹配全部 input, textarea, select 和 button 元素 

二、:text用法: $(”:text”) ;  返回值  集合元素

      说明: 匹配全部的单行文本框.

三、:password用法: $(”:password”) ; 返回值  集合元素

      说明: 匹配全部密码框.

四、:radio用法: $(”:radio”) ; 返回值  集合元素

     说明: 匹配全部单选按钮.

五、:checkbox用法: $(”:checkbox”) ; 返回值  集合元素

      说明: 匹配全部复选框

六、:submit用法: $(”:submit”) ;   返回值  集合元素

      说明: 匹配全部提交按钮.

七、:image用法: $(”:image”)   返回值  集合元素

      说明: 匹配全部图像域.

八、:reset用法: $(”:reset”) ;  返回值  集合元素

      说明: 匹配全部重置按钮.

九、:button用法: $(”:button”) ;  返回值  集合元素

      说明: 匹配全部按钮.这个包括直接写的元素button.

十、:file用法: $(”:file”) ;  返回值  集合元素

     说明: 匹配全部文件域.

十一、:hidden用法: $(”input:hidden”) ; 返回值  集合元素

      说明: 匹配全部不可见元素，或者type为hidden的元素.这个选择器就不只限于表单了,除了匹配input中的hidden外,那些style为hidden的也会被匹配.

      注意: 要选取input中为hidden值的方法就是上面例子的用法,可是直接使用 “:hidden” 的话就是匹配页面中全部的不可见元素,包括宽度或高度为0的,