jQuery选器种类.docVIP

  • 2
  • 0
  • 约9.36千字
  • 约 6页
  • 2016-10-09 发布于广东
  • 举报
jQuery选器种类

jQuery选择器 由于经常使用jQuery,但是其中的很多选择器又不太能够熟练记牢使用,所以趁着上周有人分享,我再仔细的把jQuery的选择器过一遍,争取一次拿下,以后做到运用自如。 jQuery选择器主要来分可以分为三种:(1)基本选择器 (2)层次选择器 (3)过滤选择器 (4) 表单选择器 1、基本选择器 #ID id选择器 返回一个对象 $(#div) .class 类选择器 返回集合 $(.content) Element 标签选择器 返回集合 $(input) * 匹配所有元素 返回集合 $(*) selector1,selector2,selector3,....合并每个选择器匹配的元素,返回集合 $(#div,.class,input) 2、层次选择器(主要是选择层次下面的元素) $(PC) 选择P元素下的C子元素(注意:是子元素) 返回集合 $(P+N) 选择P元素后的相邻元素(即下一个兄弟元素),和$(P).next(N)方法执行效果相同 $(P~S) 选择P元素之后的所有S兄弟元素,和$(P).nextAll(S)方法执行效果相同,SPAN style=COLOR: #ff0000另pre()方法和next()方法相对。/SPANpreAll()和nextAll()相对。 注意siblings()方法和nextAll()方法的区别:siblings()是所有前后的兄弟元素,nextAll()是所有后面的兄弟元素 第三和第四个选择器常常用后面的写法代替 3、过滤选择器(主要是按照后面的过滤条件取出前面的元素) 通过特定的过滤规则筛选DOM元素 格式过滤规则(以冒号作为过滤条件) 分类:基本过滤,内容过滤,可见性过滤,属性过滤,子元素过滤和表单对象过滤器 在可见性选择器中,需要注意选择器 :hidden,它不仅包括样式属性display为none的元素,也包括文本隐藏域(input type=hidden/)和visibility:hidden之类的元素。 .show(3000) .hide(1000 (4)属性过滤器 通过元素的属性或者属性值选择元素 :disabled :checked 选择所有被选中的单选按钮和复选框元素 :selected 选择所有下拉列表中被选中的选项元素 4、表单选择器 :submit :reset :button :image :file :hidden 需要特别注意的是后迭代选择器和过滤选择器的不同:例如: div class=test div style=display:none;aa/div div style=display:none;bb/div div style=display:none;cc/div div class=test style=display:none;dd/div /div div class=test style=display:none;ee/div div class=test style=display:none;ff/div 使用如下的jQuery选择器分别获取他们。 var len_a = $t_a.length; var len_b = $t_b.length; alert($(.test :hidden) = + len_a); //输出 4 alert($(.test:hidden) = + len_b); //输出 3 几个常用的jQuery的方法如下: show(): 显示隐藏的匹配元素。 css(name,value):给元素设置样式。 text(string):设置所有匹配元素的文本内容。 filter(expr):筛选出与指定表达式匹配的元素集合,其中expr可以是多个选择器的组合。 addClass(class),removeClass(class):为匹配的元素添加指定的类名。 toggle():交替执行方法。 下面是一个比较经典的例子: html head titlejQuery test/title script type=text/javascript src=js/jquery-1.6.2.min.js/script script type=text/javascript $(function(){ //alert(shit it); var $category = $(ul li:gt(5):not(:last)); $category.hide(); var $toggleBtn = $(div.showmore a); /* $toggl

您可能关注的文档

文档评论(0)

1亿VIP精品文档

相关文档