前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >jquery 筛选元素 (3)

jquery 筛选元素 (3)

作者头像
用户1197315
发布2018-01-19 16:13:30
1.4K0
发布2018-01-19 16:13:30
举报
文章被收录于专栏:柠檬先生柠檬先生

.addBack()   添加堆栈中元素集合到当前集合中,一个选择性的过滤选择器。   .addBack([selector])     selector     一个字符串,其中包括一个选择器表达式,匹配当前元素集合,不包括在内的元素。     <ul>       <li>list item 1</li>       <li>list item 2</li>       <li class="third-item">list item 3</li>       <li>list item 4</li>       <li>list item 5</li>     </ul>     $("li.third-item").nextAll().addBack().css("background-color",'red')         3 , 4 ,5 项的背景变成红色。 .children()   获得匹配元素集合中每一个元素的子元素,选择器选择性筛选。   .children([selector])     selector 一个用于匹配元素的选择器字符串。       $("ul .le-2").children().css("background-color","red")         //找到ul 下 类名为 .le-2 类名下的所有的子元素,将其背景颜色改成红色。 .closest()   从元素本身开始,在DOM 树上逐级向上级元素匹配。   .closest(selector)     selector 一个用于匹配元素的选择器字符串。   .closest( selector [, context ] )     selector 一个用于匹配元素的选择器字符串。     context 查找的匹配元素可以在这个DOM 元素内。   .closest(jquery object)     object 一个用于匹配元素的对象。   .closest(element)     element 一个用于匹配元素的DOM元素。     $('li.item-a').closest('li').css('background-color', 'red');       //从 li.item-a 开始向上级查找li 将其背景变成红色。     $(document).bind("click",function(e){       $(e.target).closest("li").toggleClass("hilight");         //显示什么样 的事件委托用 closeest 完成。     }); .find()   通过一个选择器,jquery对象,或元素过滤,得到当前匹配的元素集合中每个元素的后代。   .find(selector)     selector 一个用于匹配元素的选择器字符串。       ('li.item-ii').find('li').css('background-color','red');       // 含有 item-ii选择器的 li 里面过滤 li 将其背景变成红色。   .find(element)     element 一个元素或一个jQury对象用来匹配元素     var item1 = $('li.item-1')[0];       $('li.item-ii').find( item1 ).css('background-color', 'red');     // 含有 item-ii选择器的 li 里面过滤 item1 将其背景变成红色。 .next()   获得匹配元素集合中每个元素紧邻的后面的同辈元素的集合。   .next([selector])     selector 一个字符串,其中包括一个选择器表达式匹配元素。       $('li.third-item').next().css('background-color','red');       // 获得li 中含有 .third-item 选择器的元素的,下一个元素背景变成红色。     $("p").next(".selected").css("background-color","yellow");         //获取p 元素中 下一个带有.selected 选择器的元素,背景变成黄色。 .nextAll()   获取每个匹配元素集合中所有下面的同辈元素,选择性筛选的选择器。   .nextAll([selector])     selector 一个字符串,其中包括一个选择器表达式匹配元素。   $('li.third-item').nextAll().css('background-color','red');       // 获得li 中含有 .third-item 选择器的元素的,下所有元素背景变成红色。 .nextUntil()   通过选择器,或DOM 节点,或对象 得到每个元素之后所有的兄弟元素,但不包括匹配的元素。   .nextUntil([selector][,filter])     selector 一个字符串,其中包括一个匹配元素选择器表达式。      filter 一个字符串,其中包含一个选择器表达式用来匹配的元素。   .nextUntil([element][,filter])     element 一个用于匹配元素的DOM元素。     filter 一个字符串,其中包含一个选择器表达式用来匹配的元素。     $("#term-2").nextUntil("dt").css("background-color","red")       // 获取#term-2 下面所的 元素 为dt 的元素,将背景变成红色。 .parent()   取得匹配元素集合中,每一个元素的父元素,可以提供一个可选的选择器。   .parent([selector])     selector 一个字符串,其中包含一个选择器表达式用来匹配的元素。   $("li.item-a").parent().css('background-color', 'red');     // 获得li 中含有 .item-a 选择器的元素的父元素,将背景变成红色。   $("p").parent(".selected").css("background", "yellow");    //获取p 元素中 下一个带有.selected 选择器的元素 父元素,背景变成黄色。 .parents()   获取集合中每一个匹配元素的祖先元素,可以提供一个可选的选择器作为参数。   .parents([selector])     selector 一个字符串,其中包含一个选择器表达式用来匹配的元素。     $('li.item-a').parents().css('background-color', 'red');       // 获得li 中含有 .item-a 选择器的元素的所有祖先元素。     $("span.selected").parents("div").css("border", "2px red solid")       //获取到span 元素含有 .selected 的元素的所有祖先元素的div .parentsUntil()    查找当前元素的所有的前辈元素,直到遇到选择器,DOM 对象 匹配的元素为止。   .parentsUntil([selector][,filter])     selector 选择器字符串,用于匹配到哪个祖先元素时停止匹配。     filter 一个字符串,用于匹配元素的选择器表达式字符串。   .parentsUntil([element][,filter])     element DOM节点 或对象 用于确定到哪个前辈元素时候停止匹配。     filter 一个字符串,用于匹配元素的选择器表达式字符串。       $("li.item-a").parentsUntil(".level-1").css("background-color", "red"); .prev()   取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的集合。选择性筛选的选择器。   .prev([selector])     selector 一个用于匹配元素的选择器字符串。       $('li.third-item').prev().css('background-color', 'red');         // 获得li 中含有 .third-item 选择器的元素的,上一个元素背景变成红色。 .prevAll()    获取集合中每一个匹配元素的所有前面的兄弟元素。     .prevAll([selector])     一个字符串,其中包含一个选择器表达式匹配元素。       $('li.third-item').prevAll().css('background-color', 'red'); .prevUntil()   .prevUntil( [selector ] [, filter ] )    selector   选择器字符串,用于确定到哪个排在前面的同辈元素时停止匹配   filter     一个字符串,其中包含一个选择器表达式用来匹配的元素。     $("#term-2").prevUntil("dt").css("background-color", "red"); .siblings()   获得匹配元素集合中每一个元素的兄弟元素,可以提供一个可选的选择器。   .siblings([selector])     selector 一个用于匹配元素的选择器字符串。       $('#term-2').siblings().css("background-color", "red");       $("p").siblings(".selected").css("background", "yellow");

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2015-10-28 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档