jquery 筛选元素 (3)
.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");
转载于:https://www.cnblogs.com/nmxs/p/4917711.html
jquery 筛选元素 (3)相关推荐
- jQuery学习笔记——筛选元素集合
filter(expression) 方法 利用传入的选择器表达式或筛选函数,从集合中筛选元素. expression为选择器表达式 e.g. 对所有标签<a>中title包含文本spec ...
- js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) var test = document.getElementById("test&q ...
- Javascript及Jquery获取元素节点以及添加和删除操作
用了javascript和jquery很久,把所有元素节点的操作总结了下,放在博客上作为记录. Javascript获取元素的主要方式有三种 1.document.getElementById('ma ...
- jquery遍历元素children、find、parent、parents、parentsUntil、next、prev、siblings、closest、filter、not
全栈工程师开发手册 (作者:栾鹏) jquery系列教程2-DOM操作全解 jquery遍历元素 jquery元素的函数包括children.find.parent.parents.parentsUn ...
- jquery获取元素四种方式。
jquery获取元素四种方式. 当你成功引入jquery插件之后,就可以用jquery的语法来获取html元素. js获取只有document.getElementById或者通过名称来获取. 而jq ...
- Jquery查找元素的方法汇总
Jquery查找元素的方法汇总 通过具体的class,id,标签查找 $('div') // 所有div元素 $('.item') // class为item的元素 $('#main') // id为 ...
- JQuery基本操作 JQueryCSS操作 JQuery筛选选择器 JQuery筛选方法 JQuery效果
JQuery 基本使用 原生JS获取的对象就是DOM对象 JQuery方法获取的元素是JQuery对象 (伪数组形式存储) 不能使用原生Js的属性和方法 DOM对象转换为 JQuery 对象 $ ...
- jQuery选择元素的方法
一..get(index) 通过jQuery对象获取一个对应的DOM元素. index从0开始,用来确定获取哪个元素. 二.eq(index) 根据索引获取jQuery对象 当index为正数,索引从 ...
- Jquery筛选hasclass()的方法
Hasclass():检查当前元素是否含有某个特定的类,如果有,则返回true值. 第一步先创建一个div,给这个div添加一个类 <div class="protected" ...
最新文章
- JUC多线程核心知识-思维导图
- 深度系统linux deepin如何按装,U盘快速安装深度操作系统Deepin详细过程 体验不一样的桌面系统...
- 高等数学上-赵立军-北京大学出版社-题解-练习4.5
- java例程练习(多线程[线程同步问题])
- php 输出tab_php实现读取和写入tab分割的文件
- 世界杯:左撇子在体育方面大有前途
- 戴尔R730服务器,U盘安装服务器阵列(raid)卡驱动,识别硬盘。
- 谈谈对计算机网络的了解,对计算机网络的认识和了解
- 计算机四级数据库工程师考什么,计算机四级《数据库工程师》考试大纲
- 主动学习、纯半监督学习与直推学习
- 写尽自己一个人的孤独,却写不出心里的寂寞
- linux中ftp服务器的搭建和配置
- VS 【】处有未经处理的异常(在【程序名】.exe 中): 0xC00000FD: Stack overflow (参数: 0x00000000,0x008D2000)。
- .NET 反编译工具
- 史上最全阿里 Java 面试题总结及答案
- 卸甲归田——回顾CSP2019
- 今年流行的3步走,学习前端方法路径总结
- MFC 控件PictureControl 清除显示
- 家人们,我差点和程序员打起来了
- Python有限体积流体开尔文-亥姆霍兹不稳定性
热门文章
- Monty Hall 问题与贝叶斯定理的理解
- [转载]程序员如何写出杀手级简历
- rel=alternate stylesheet属性
- Nodejs学习笔记(七)——接口API
- mysql 5.7.6 5.7.19_免编译安装mysql 5.7.19
- Setting Up ODI's Schedule
- 按键精灵saystring无法使用的几种解决方案
- 美国百亿亿次超算要比中国晚两三年,但真实性能更恐怖
- IOS9 微信sdk升级指南
- 为什么不能在SSH(Secure Shell)登录中设置ulimit值?