首页
学习
活动
专区
工具
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'); //获取所有类名不为class的div节点 $('div').filter('.class'); //获取所有类名为class...jQuery.filter()是从初始的jQuery对象集合中筛选出一部分,而jQuery.find()的返回结果,不会有初始集合中的内容,比如("p").find("span"),是从p元素开始找,等同于

16210

【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.9K20

    《Java初阶数据结构》----3.<线性表---LinkedList与链表>

    喜欢我文章的兄弟姐妹们可以点赞,收藏和评论我的文章。喜欢我的兄弟姐妹们以及也想复习一遍java知识的兄弟姐妹们可以关注我呦,我会持续更新滴, 望支持!!!!!!一起加油呀!!!!...因此是链表的属性,切勿放到节点类之中。...节点类只有两个属性,值域和下一个节点的地址域 //要表示节点的地址,因此是ListNode类型 public ListNode head; 简单的初始化链表 public...; cur.next = node; } 找到要删除节点的位置的前一个节点 //找到要删除节点的位置的前一个节点 private ListNode findIndexSubOne...node; cur.prev = node; } 找到第n个节点的位置 //双链表,由于知道了前一个节点的位置 //因此插进第n个元素时直接找到第n个节点的位置就可以

    8210

    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.7K10

    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()

    90010

    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.2K10

    jquery选择器

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

    1.8K20

    jQuery常用函数汇总

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

    15320

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

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

    12.2K30

    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()。

    79030

    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等于myClass的div元素 $('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

    75120

    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.8K30

    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.2K50
    领券