一、获取父级元素

  使用jquery获取父级元素: parent()

  例如:$(this).parent('ul');

二、获取同级元素

  使用jquery获取同级元素:siblings()

  例如:$(this).parent('ul').siblings();

三、获取子级元素

  使用jquery获取子级元素:find()

  例如:$(this).parent('ul').siblings().find('li');

常用例:(点击进行切换)

  $(function(){

    $('.xxx li').click(function(){

      //addClass给当前元素添加一个on的类

      $(this).addClass('on');

      //并且把当前的兄弟元素的on类移除

      $(this).siblings().removeClass('active');

   

      //把当前的父元素ul的兄弟元素的子元素li移除on类

      $(this).parent('ul').siblings().find('li').removeClass('on');

      //遍历xxx-x当前的ndex并且添加一个sho的类,移除兄弟元素的sho类

      $('.xxx-x').eq($(this).index()).addClass('sho').siblings().removeClass('sho')

       });
  });

常用例:(点击显示和隐藏) 

  $(function(){
    $('.xxx').click(function(){
      console.log(this)
      if($('#xx').hasClass('on')){
        $('#xx').removeClass('on');
        $('#xx').css({
          'display' : 'none',
        })
      }else{
        $('#xx').addClass('on');
        $('#xx').css({
          'display' : 'block',
        })
      }
    })
  })

jquery获取元素(父级的兄弟元素的子元素)的更多相关文章

  1. jQuery获取所有父级元素及同级元素及子元素的方法

    jQuery获取所有父级元素及同级元素及子元素的方法 1.获取父级元素 $("#id").parent() 获取其父级元素 $("#id").parents() ...

  2. IE6下绝对定位元素父级宽高是奇数,绝对定位元素的right和bottom值会有1个像素的偏差

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 当父级是body时,子元素设置position:absolute;定位是根据body还是html呢?

    position:absolute 元素相对最近的 position 为 absolute / relative / fixed 的祖先元素(包含块)定位,如果没有这样的祖先元素,则以初始包含块进行定 ...

  4. Java IO,io,文件操作,删除文件,删除文件夹,获取文件父级目录

    Java IO,io,文件操作,删除文件,删除文件夹,获取文件父级目录 这里先简单的贴下常用的方法: File.separator //当前系统文件分隔符 File.pathSeparator // ...

  5. jQuery 父级,祖先,兄弟,等选择性操作

    jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(&q ...

  6. jquery的父级和兄弟级能做多少网页特效

    这里说的父级就是parent  兄弟级就是siblings 我这里说一个导航栏用到的特效 主要jquery代码$(this).parent().addClass(“active”).siblings( ...

  7. ie7 父元素宽度自适应且为浮动的话 子元素的宽度将不能按比例设置问题

    好久没切图,昨天遇到个浏览器兼容的老问题,在ie7下,父元素设置浮动后,其宽度是自适应的,子元素的宽度若没有确定则将显示最小宽度,即文本所占的宽度. 正常其他浏览器显示如下: ie7中显示效果如下: ...

  8. SQL根据指定节点ID获取所有父级节点和子级节点

    --根据指定节点ID获取所有子节点-- WITH TEMP AS ( SELECT * FROM table_name WHERE Id=' --表的主键ID UNION ALL SELECT T0. ...

  9. SQL根据指定节点ID获取所有父级节点和子级节点(转载)

    --根据指定节点ID获取所有子节点-- WITH TEMP AS ( ' --表的主键ID UNION ALL SELECT T0.* FROM TEMP,table_name T0 WHERE TE ...

随机推荐

  1. 【双连通分量】Bzoj2730 HNOI2012 矿场搭建

    Description 煤矿工地可以看成是由隧道连接挖煤点组成的无向图.为安全起见,希望在工地发生事故时所有挖煤点的工人都能有一条出路逃到救援出口处.于是矿主决定在某些挖煤点设立救援出口,使得无论哪一 ...

  2. BZOJ_2142_礼物_扩展lucas+组合数取模+CRT

    BZOJ_2142_礼物_扩展lucas+组合数取模 Description 一年一度的圣诞节快要来到了.每年的圣诞节小E都会收到许多礼物,当然他也会送出许多礼物.不同的人物在小E 心目中的重要性不同 ...

  3. LOJ_2305_「NOI2017」游戏 _2-sat

    LOJ_2305_「NOI2017」游戏 _2-sat 题意: 给你一个长度为n的字符串S,其中第i个字符为a表示第i个地图只能用B,C两种赛车,为b表示第i个地图只能用A,C两种赛车,为c表示第i个 ...

  4. 深入解读Service Mesh的数据面Envoy

    在前面的一篇文章中,详细解读了Service Mesh中的技术细节,深入解读Service Mesh背后的技术细节. 但是对于数据面的关键组件Envoy没有详细解读,这篇文章补上. 一.Envoy的工 ...

  5. unison+inotify的Web目录同步方案

    1.在Linux下做WEB目录文件同步 一般有如下几种方式: ----------------------------------------------- 1)       nfs实现web数据共享 ...

  6. 使用elementUI的时候,使用Upload 上传的时候,使用 list-type 属性来设置文件列表的样式,before-upload方法失效

    最近在做项目的时候,使用elementUI的时候,使用Upload 上传的时候,before-upload方法失效. 情况下:使用 list-type 属性来设置文件列表的样式. 最终的优化之后:(演 ...

  7. .Net Core使用Redis(CSRedis)

    前言 CSRedis是国外大牛写的.git地址:https://github.com/2881099/csredis,让我们看看如果最简单的 使用一下CSRedis吧. 引入NuGet 获取Nuget ...

  8. 学JAVA的第十九天,抽象类注意事项

    最近老师老是不讲新课,好繁!!! 还是来说抽象类吧. public abstract class A{ //因为下边有一个抽象方法,所以这就必须要是一个抽象类,要不然编译不能通过 public voi ...

  9. 看一眼就学会的 HTML 小游戏搭建!

    本文作者:CODING 用户 - xfly 身边经常会有小伙伴问我有没有办法不买服务器也能上线自己的个人项目,比如不少同学都非常喜欢搭建一个属于自己的博客站点或者小游戏等. 目前相对比较简便的且不花自 ...

  10. .NET Framework和 .Net Core实现不一致的API之 `EmailAddressAttribute`

    .NET Framework和 .Net Core实现不一致的API之 EmailAddressAttribute Intro 现在我们的类库项目大多是 NETStandard2.0 项目,但是 ne ...