jQuery怎样获取同级元素?

jQuery怎样获取同级元素?

在jquery中,获得同级元素的方法一般有七个,分别是siblings()、next()、nextAll()、nextUntil()、prev()、prevAll()、prevUntil(),下面分别介绍它们的使用。

1、siblings()方法,主要用于获得指定元素的同级所有元素

例如,下面代码获得h2元素所有同级元素,并设置边框颜色为红色。(相关课程推荐:jQuery教程

$('h2').siblings().css({
    'color': 'red',
    'border': '1px solid red'
})

1.jpg

2、next()方法,主要用于获得指定元素的下一个同级元素

例如,下面代码获得h2元素的下一个同级元素,并设置其边框颜色为红色。

$('h2').next().css({
    'color': 'red',
    'border': '1px solid red'
})

2.jpg

3、nextAll()方法,主要用于获得指定元素的下一个同级的所有元素

例如,下面代码获得h2元素的下一个同级的所有元素,并设置其边框颜色为红色。

$('h2').nextAll().css({
    'color': 'red',
    'border': '1px solid red'
})

3.jpg

4、nextUntil()方法,主要用于获得指定元素的下一个同级元素

这个同级元素必须为指定元素与nextUntil()方法所设置元素之间的元素,例如,下面代码获得h2元素的下一个同级元素为h2与h6之间的元素,并设置其边框颜色为红色。

$('h2').nextUntil('h6').css({
    'color': 'red',
    'border': '1px solid red'
})

4.jpg

5、prev()方法,主要用于获得指定元素的上一级同级元素

例如,下面代码获得类名为 "selected" 的上一个同级元素,并设置其背景颜色为黄色。

$('p').prev('.selected').css('background', 'yellow')

5.jpg

6、prevAll()方法,主要用于获得指定元素上一级所有的同级元素

例如 ,下面代码获得最后一个div之前所有同级div,设置为红色边框。

$('div:last').prevAll().addClass('before')

6.jpg

7、prevUntil()方法,主要用于获得指定元素的上一个同级元素

这个同级元素必须为指定元素与prevUntil()方法所设置元素之间的元素,例如,下面代码获得id为term-2的元素的上一个同级元素在term-2与dt之间的元素,并设置背景颜色为红色。

$('#term-2').prevUntil('dt').css('background-color', 'red')

7.jpg

Image placeholder
前端答疑
未设置
  19人点赞

没有讨论,发表一下自己的看法吧

推荐文章
块级元素和行级元素

块级标签:divph1-h6ulol等,行内标签:aspan等行内块标签:imginputbutton等. ####行内块特点: 1.不独占一行 2.可以设置宽高

jquery怎么获取第几个元素?

在jquery中,可以使用eq()方法找到第几个元素或第N个元素,jquery中eq()的使用如下:eq()选择器选取带有指定index值的元素。index值从0开始,所有第一个元素的index值是0

jquery如何显示和隐藏元素?

jquery如何显示和隐藏元素?JQ中显示隐藏元素有这几种方式show()、hide()、toggle()、slideDown(),以及使用css方法设置display属性。1、show()方法显示出

jquery如何添加元素?

jquery如何添加元素?添加元素可以使用append()、prepend()、after()、before()、appendTo()方法。1、append()方法:在被选元素的结尾插入元素或内容2、

jquery如何删除元素?

jquery如何删除元素?如需删除元素和内容,一般可使用以下两个jQuery方法:●remove()-删除被选元素(及其子元素)●empty()-从被选元素中删除子元素1、remove()方法:删除被

jquery判断是否是数组元素?

jquery判断是否是数组元素?语法:$.inArray("元素字符串",数组名称);使用示例:(相关课程推荐:jQuery教程)如果arry数组里面存在"C#"这个字符串则返回该字符串的数组下标,否

jQuery如何选择以特定字符开头的ID元素?

jQuery如何选择以特定字符开头的ID元素?jquery选择器中选取以特定字符开头的元素可以使用$('element[attr^=特定字符]')方法。例如选取p元素中id以abc开头的元素。(相关课

jQuery如何按name属性选择元素?

方法1:使用name属性选择器name属性选择器可用于按name属性选择元素。此选择器选择值与指定值完全相等的元素。语法:[name=“nameOfElement”]示例:输出:方法2:使用javas

HTML中行内元素与块级元素区别有什么?

HTML中行内元素与块级元素区别有什么?区别有:●行内元素和其他行内元素都会在一条水平线上排列,都是在同一行的。●块级元素却总是会在新的一行开始排列,各个块级元素独占一行,垂直向下排列。●行内元素不可

行内元素与块级元素

用途:页面布局 块级元素独占一行,行内元素在同一行。块级元素占用宽度100%,行内元素有内容决定。块级元素可以设置宽高,行内元素不行。 块级元素标签h1-h6pdiv行内元素标签:spanaemib

jquery怎么判断元素是第几个?

jquery怎么判断元素是第几个?假设有下面这样一段HTML代码: jQuery判断当前元素是第几个元素示例 jQuery获取第N个元素示例 jQuery选择器示例 如果我们点击任何一个li标签,想知

jquery怎么判断元素是否存在?

使用JQuery想要判断元素是否存在,可以使用jQuery.length属性来实现。当DOM中存在特定元素时触发某个事件,那么就可以使用jQuery.length属性来确定元素是否存在。下面我们就结合

jQuery怎么删除元素节点?

1、使用empty()删除empty顾名思义,清空方法,但是与删除又有点不一样,因为它只移除了指定元素中的所有子节点。 p元素1 p元素2 点击通过jQuery的empty移除元素 $("but

jquery怎么获取a标签href的值?

jquery怎么获取a标签href的值?href是a标签的一个属性,获取属性的值,在jquery中使用attr()方法。获取a标签的href属性就是$('a').attr('href')语法:$(se

jquery怎么获取name属性值?

新建一个html文件,命名为test.html,用于讲解jquery中怎么获取元素的name属性。在test.html文件内,在p标签内,使用input标签创建一个文本框,并设置其id为mytxt,主

jquery和jquery ui的区别?

jquery和jqueryui的区别?区别有:1、jQuery是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。 2、jQueryUI则是在jQuery的基础上,利用jQuery的扩展性,

jquery如何获取html元素的内容?

jquery如何获取html元素的内容?一、text():设置或返回所选元素的文本内容文本信息 $('#p').text();//文本信息 $('#p').text('新的文本');二、html()

jquery如何获取隐藏元素的高度?

jquery如何获取隐藏元素的高度?jquery获取隐藏元素的高度可以直接使用height()方法。例如: #app{ width:100px; height:1000px; display:no

jquery如何获取当前元素的位置?

jquery获取当前元素的位置,并且是相对于文档的位置。我们可以使用jQueryoffset()方法来实现。offset()方法仅适用于可见元素。下面我们结合简单的代码,给大家介绍jquery获取当前

jquery怎么写ajax?

jquery怎么写ajax?两种在客户端和服务器端进行请求-响应的常用方法是:GET和POST。GET-从指定的资源请求数据POST-向指定的资源提交要处理的数据GET基本上用于从服务器获得(取回)数

jquery怎么遍历json数组?

jquery怎么遍历json数组?jquery遍历集合可以使用$.each(集合,回调函数)方法,//这里直接使用Array来构造json数组,服务器返回的数据可以使用JSON.parse()函数进行

jQuery :empty怎么用?

jQuery:empty怎么用?作用::empty选择器选取空的元素。空元素指的是不包含子元素或文本的元素。语法:$(":empty")(推荐学习:jQuery教程手册)jquery:empty选择器

jquery怎么实现淡入淡出效果?

jquery怎么实现淡入淡出效果?jquery实现淡入效果使用fadeIn()、淡出效果使用fadeOut(),来回切换使用fadeToggle()。●jQueryfadeIn()方法:用于淡入已隐藏

jquery怎么操作json?

使用jquery中的$.parseJSON()将字符串转为json对象,它对json数据格式的要求较高,必须要双引号包围起来格式:$.parseJSON(string)例如: varjsonStr='

jquery怎么禁用a标签?

jquery怎么禁用a标签?1、使用attr()方法删除a标签的链接,并重新设置click事件。$("a").each(function(){ $(this).css("cursor","defaul