首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

jQuery找到某个类的next/prev元素,但不一定是兄弟姐妹

在jQuery中,可以使用.next().prev()方法来找到某个类的下一个或上一个元素,但这些元素必须是兄弟姐妹关系。如果要找到任意位置的下一个或上一个元素,可以使用.nextAll().prevAll()方法。

例如,如果要找到某个类名为.my-class的元素的下一个元素,可以使用以下代码:

代码语言:javascript
复制
$('.my-class').next()

如果要找到某个类名为.my-class的元素的所有下一个元素,可以使用以下代码:

代码语言:javascript
复制
$('.my-class').nextAll()

同样,要找到某个类名为.my-class的元素的上一个元素,可以使用以下代码:

代码语言:javascript
复制
$('.my-class').prev()

如果要找到某个类名为.my-class的元素的所有上一个元素,可以使用以下代码:

代码语言:javascript
复制
$('.my-class').prevAll()

需要注意的是,这些方法只能找到同级别的元素,如果要找到子元素或父元素,需要使用其他方法。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

jQuery常见结点操作

— 注意 获取某个子节点或者父节点使用选择器过滤即可! 获取hxb所有祖先元素 hxb.parents(expr) 这是是查找所有祖先元素,不限于父元素。类似于js中offsetParent。...获取hxb个兄弟节点 hxb.next() — 获取hxb个兄弟节点 hxb.prev() — 获取hxb之前所有兄弟节点 hxb.nextAll() — 获取hxb之后所有兄弟节点 hxb.prevAll...() — 获取hxb所有兄弟姐妹节点 hxb.siblings() 返回所有兄弟姐妹节点,不分前后。...$('div').not('.class'); //获取所有名不为classdiv节点 $('div').filter('.class'); //获取所有名为class...jQuery.filter()是从初始jQuery对象集合中筛选出部分,而jQuery.find()返回结果,不会有初始集合中内容,比如("p").find("span"),是从p元素开始找,等同于

13810

【JavaWeb】85:jQuery各种选择器

通过它可以操作对应id标签。 ②选择器 格式为:$(".divClass")。 通过它可以操作对应标签。...jQuery语法简洁之处就是在于此:如果是使用js语法,得到元素个数组,所以要使用for循环依次赋值。 事实上jQuery对象本身就是个js数组,相当于将for循环遍历赋值这个步骤简化了。...我们做个对比: ? ③标签选择器 格式为:$("div")。 通过它可以操作对应标签名标签,其效果和选择器很相似。 ④全选选择器 格式为:$("*")。这是jQuery中多于CSS。...③层级选择器:prev+next 格式为:$("#DivId01+div"),选择器之间用加号隔开。 prev:上个,id选择器,id为DivId01。 next:下个。...所以是id为DivId01个Div标签。 ④层级选择器:prev~siblings 格式为:$("#DivId01~div"),选择器之间用~隔开。 prev:上个,规则同上。

8.8K20

JS获取节点兄弟,父级,子级元素方法

()或者$("span").parent(".class") jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素 jQuery.children...这个方法和children()区别就在于,包括空白文本,也会被作为jQuery对象返回,children()则只会返回节点 jQuery.prev(),返回上个兄弟节点,不是所有的兄弟节点 jQuery.prevAll...(),返回所有之前兄弟节点 jQuery.next(),返回下个兄弟节点,不是所有的兄弟节点 jQuery.nextAll(),返回所有之后兄弟节点 jQuery.siblings(),返回兄弟姐妹节点...,不分前后 jQuery.find(expr),跟jQuery.filter(expr)完全不样。...jQuery.filter()是从初始jQuery对象集合中筛选出部分,而jQuery.find()返回结果,不会有初始集合中内容,比如$("p"),find("span"),是从元素开始找

9.2K10

jQuery」基础 - 02

遍历元素 jQuery 隐式迭代是对同元素做了同样操作。 如果想要给同元素做不同操作,就需要用到遍历。...语法1 注意:此方法用于遍历 jQuery 对象中项,回调函数中元素为 DOM 对象,想要使用 jQuery 方法需要转换。...jQuery 尺寸操作 jQuery 尺寸操作包括元素宽高获取和设置,且不API对应不盒子模型。...案例:品优购电梯导航(下) 当我们点击电梯导航某个小li, 当前小li 添加current,兄弟移除名 当我们页面滚动到内容区域某个模块, 左侧电梯导航,相对应小li模块,也会添加current...each里面能拿到内容区域每个模块元素和索引号 判断条件: 被卷去头部 大于等于 内容区域里面每个模块offset().top 就利用这个索引号找到相应电梯导航小li添加。 代码实现略。

2.8K20

JS和JQuery获取当前元素兄弟及父级等元素方法

) jQuery.parents(expr),类似于 jQuery.parents(expr) ,但是是查找所有祖先元素,不限于父元素 jQuery.children(expr),返回所有子节点,这个方法只会返回直接孩子节点...这个方法和 children() 区别就在于,包括空白文本,也会被作为jQuery 对象返回, children() 则只会返回节点 jQuery.prev(),返回上个兄弟节点,不是所有的兄弟节点...jQuery.prevAll(),返回所有之前兄弟节点 jQuery.next(),返回下个兄弟节点,不是所有的兄弟节点 jQuery.nextAll(),返回所有之后兄弟节点 jQuery.siblings...(),返回兄弟姐妹节点,不分前后 jQuery.find(expr),跟 jQuery.filter(expr) 完全不样: jQuery.filter(),是从初始 jQuery 对象集合中筛选出部分...;   //获得s最后个子节点 JS获取节点父级,子级元素:JS方法会比JQUERY麻烦很多,主要则是因为FF、谷歌浏览器会把你换行也当作DOM元素:空text元素,目前IE也是这样 <div

12.4K10

jquery教程之查找筛选函数

jquery教程之查找筛选函数 、eq 获取当前链式操作中第N个jQuery对象,返回jQuery对象 $("p").eq(1) 从0开始 $("p:eq(1)") 二、hasClass 检查当前元素是否含有某个特定...,如果有,则返回tru $("p").hasClass("red") 三、children 取得个包含匹配元素集合中每元素所有子元素元素集合。...$("span").parents() 六、next nextAll next 取得个包含匹配元素集合中每元素紧邻后面同辈元素元素集合 nextAll 查找当前元素之后所有的同辈元素...$("p").next() 七、prev prevAll prev 取得个包含匹配元素集合中每元素紧邻个同辈元素元素集合 prevAll 查找当前元素之前所有的同辈元素 $("p...").prev() 八、siblings 取得个包含匹配元素集合中每元素所有唯同辈元素元素集合 $("div").siblings()

88010

JQuery简述、使用方法和选择器

使用前准备 ? JQ中常用选择器 、基本选择器 1、id选择器 通过元素id获取相关元素 ? 2、元素选择器 获得body内相关元素,如div、input等 ?...3、选择器 通过元素名获取相关元素,eq()方法获取元素,下标从0开始 ? 4、通用选择器 找到元素 ? 5、分组选择器 找到匹配任意元素。 ?...3、prev + next 匹配所有紧接在 prev 元素 next 元素 ?...4、prev ~ siblings 匹配 prev 元素之后所有 siblings 元素(同级别/同辈) ?...三、子元素选择器 1、:nth-child 匹配其父元素第N个子或奇偶元素 ‘:eq(index)’ 只匹配元素,而这个将为每个父元素匹配子元素

1.1K10

jquery选择器

jquery用法思想 选择某个网页元素,然后对它进行某种操作 jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功。...').filter('.myClass'); //选择class等于myClassdiv元素 $('div').eq(5); //选择第6个div元素 上面演示如何使用jquery来选择上元素,那么下面继续来演示下选择集过滤...选择集转移 $('div').prev(); //选择div元素前面紧挨同辈元素 $('div').prevAll(); //选择div元素之前所有的同辈元素 $('div').next(); //选择...元素 $('div').prev(); //选择div元素前面紧挨同辈元素 ?...判断是否选择到了元素 jquery有容错机制,即使没有找到元素,也不会出错,可以用length属性来判断是否找到元素,length等于0,就是没选择到元素,length大于0,就是选择到了元素

1.7K20

jQuery常用函数汇总

尽管如此,jQuery仍然被广泛使用,并且对于些特定场景和项目仍然是个有价值工具。...获取元素//$(选择器)$('div')//获取页面中所有div元素,返回jQuery对象get()参数为索引,返回值是原生对象eq()参数为索引,返回值为jQuery对象操作名hasClass...()检测某个元素是否有某个名,返回值为true或falseaddClass()给某个元素添加名,返回值为jQuery对象removeClass()移除名toggleClass()切换名,有就删除...,没有就增加查找元素parent()找到元素父级元素next()找到元素紧挨个兄弟节点prev()找到元素紧挨个兄弟节点nextAll()找到元素下面所有兄弟节点传入选择器,找下面符合选择器兄弟节点...prevAll()找到元素上面所有兄弟节点传入选择器,找上面符合选择器兄弟节点siblings()找到元素所有兄弟元素children()找到元素所有子元素find()通过参数名找该元素下面的元素效果

12820

jquery选择器用法_jQuery属性选择器

jQuery选择器 、 基本选择器 1....在个页面中,元素可以有多个CSS个CSS又可以匹配多个元素,如果有元素中有个匹配名称就可以被选择器选取到。...(可以是ID选择器、元素选择器或是名选择器)组合在起,两个选择器之间以逗号”,”分隔,只要符合其中任何个筛选条件就会被匹配,返回个集合形式jQuery包装集,利用jQuery索引器可以取得集合中...元素元素 示例:(“prev+next”) prev是指任何有效选择器 next个有效选择器并紧接着prev选择器...匹配ul元素最后个子元素li :only-child 说明:如果某个元素是它父元素中唯元素,那么将会被匹配,如果父元素中含有其他元素

12.1K30

jQuery三种$()

$号是jQuery个别称,$()构造了jQuery对象。所以,“$()”可以叫做jQuery构造函数(个人观点,呵呵!)。...所以,$('#sId>li')所选择是id为"sId"所有孩子节点,即使这个后代还有也不是它所找范围(所找到DOM对象,只是它本级DOM对象。)。...而$('#sId li:not(.horizontal)'),就是指名"sId"里面的所有li子孙中没有horizontal所有元素。...个节点 $('td:contains("Henry")').next()——内容包含有"Henry"个节点 $('td:contains("Henry")').siblings...()——内容包含有"Henry"所有兄弟节点 还有个,就是end(),这个方法肯定是用在某个DOM节点执行了某动作之后,还想在与其相关节点上执行类似动作,这里就要用到end()。

77630

jQuery基本操作

· selector1 //个有效选择器 selector2 //另个有效选择器 selectorN //任意多个有效选择器 //描述 //找到匹配任意元素 HTML代码...代码 $("form > input") 结果 []  prev + next  //概述 //匹配所有紧接在prev元素next元素 prev //任何有效选择器...~siblings //概述 //匹配prev元素之后所有siblings元素 prev //任何有效选择器 siblings //个选择器,并且它作为第个选择器同辈 //描述 //找到所有与表单同辈...ul> jQuery代码 $("li").last() 结果 [list item3]   has //概述 //检查当前元素是否含有某个特定,如果有,则返回true...class 用于匹配名 实列 //描述 //给包含有某个元素进行个动画.

7.5K20

Jquery选择器与样式操作

jquery选择器 jquery用法思想 选择某个网页元素,然后对它进行某种操作 jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功...); //选择class等于myClassdiv元素 $('div').eq(5); //选择第6个div元素 选择集转移 $('div').prev(); //选择div元素前面紧挨同辈元素 $(...'div').prevAll(); //选择div元素之前所有的同辈元素 $('div').next(); //选择div元素后面紧挨同辈元素 $('div').nextAll(); //选择div元素后面所有的同辈元素...$('div').find('.myClass'); //选择div内class等于myClass元素 判断是否选择到了元素 jquery有容错机制,即使没有找到元素,也不会出错,可以用length...这是个div jquery样式操作 jquery用法思想二 同个函数完成取值和赋值 操作行间样式 // 获取div样式 $("div").css("width

73320

jQuery入门前言

,选择给定祖先元素“ancestor”所有descendant后代,包括儿子、孙子、曾孙等 $("prev + next") 相邻兄弟选择器,选择紧接在“prev元素next元素 $("prev...可以只指定该元素某个属性,这样所有使用该属性而不管它值,这个元素都将被定位,也可以更加明确并定位在这些属性上使用特定值元素,这就是属性选择器展示它们威力地方。 ?...直到找到个匹配就停止查找,parents直查找到元素,并将匹配元素加入集合 结果不同:.closest返回是包含零个或元素jquery对象,parents返回是包含零个或个或多个元素...jquery对象 4、next()、prev()和siblings()方法: 用于快速查找指定元素集合中每元素紧邻后面同辈元素元素集合。...prev方法和next()相反,next是找下个,prev是找前个。$('.item-1').next()是item-2,$('.item-2').prev()就是item-1。

2.7K30

JavaScript学习笔记(四)—— jQuery入门

选择器 描述 ancestor descendant 在给定祖先元素下匹配所有的后代元素 parent>child 在给定元素下匹配所有的子元素 prev+next 匹配所有紧接在prev元素...next元素 pre~siblings 匹配prev元素之后所有siblings元素 $( "ul.topnav > li" ).css( "border", "3px double...='newsletter']" ).next().append( "; not newsletter" ); 2. jQuery选择器 伪选择器可以看成是种特殊选择器...简单伪选择器 伪选择器 说明 :not(selector) 选择除了某个选择器之外所有元素 :first或first() 选择某元素元素 :last或last() 选择某元素最后元素...odd").css("background-color", "#bbbbff"); 子元素选择器 子元素选择器就是选择某元素下面的子元素方式,在jQuery中,子元素选择器分为两大类

11.1K50

ArrayList和LinkedList如何实现?我看你还有机会!

数组概念 上面的图可以很直观体现数组存储结构,因为数组内存地址连续,元素类型固定,所有具有快速查找某个位置元素特性;同时也因为数组需要段连续内存,所以长度在初始化长度已经固定,且不能更改。...= prev; } } 可以看到这就是个典型双向链表结构,item 用来存放元素值;next 指向下个 node 节点,prev 指向上个 node 节点。.... */ // 在指定节点处新增元素,修改指定元素个节点为新增元素,新增元素个节点是查找到得 node next节点指向, // 新增元素个节点为查找到 node 节点,查找到...主要就是修改 node next 指向为新节点,新节点 prev 指向为查找到 node 节点,新节点 next 指向为查找到 node 节点 next 指向。...查找到 node 节点 next 指向 node 节点 prev 修改为新节点。 ?

52710
领券