一、获取父级元素

  使用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. [Poi2014]FarmCraft 树状dp

    对于每个点,处理出走完其子树所需要的时间和其子树完全下载完软件的时间 易证,对于每个点的所有子节点,一定优先选择差值大的来给后面的时间 树规+贪心. #include<cstdio> #i ...

  2. 安装VMware错误,Microsoft Runtime DLL 安装程序未能完成安装

    安装VMware-workstation-full-12.5.6-5528349, 出现如下错误: 这时候,要注意了,不要点击"确认",如果手快点击了,没关系再次运行VMware安 ...

  3. BZOJ_4320_ShangHai2006 Homework_分块

    BZOJ_4320_ShangHai2006 Homework_分块 Description   1:在人物集合 S 中加入一个新的程序员,其代号为 X,保证 X 在当前集合中不存在.    2:在当 ...

  4. Nginx隐藏index.php和配置vhost

    nginx启动命令 启动:nginx停止:nginx -s stop退出:nginx -s quit重启:nginx -s reopen重新加载:nginx -s reload平滑启动:kill -H ...

  5. Redis+Restful 构造序列号和压力测试【后续】

    大家还记上篇博文https://www.cnblogs.com/itshare/p/8643508.html,测试redis构造流水号的tps是600多/1s. 这个速度显然不能体现redis 集群在 ...

  6. typeof和instansof的区别

    typeof typeof 是一个一元运算,放在一个运算数之前,运算数可以是任意类型. 它返回值是一个字符串,该字符串说明运算数的类型.(typeof 运算符返回一个用来表示表达式的数据类型的字符串. ...

  7. linux命令----查看磁盘空间

    今天用“web发布平台”发布测试的服务,两个节点中发现有一个节点没有发布成功,压测TPS始终上不去,排查后发现只有一个节点在打日志,另一个节点的服务进程都没有在运行,由此断定应该是没有发布成功,有点坑 ...

  8. (翻译)W3C的Turtle文档

    主要翻译如下页面,https://www.w3.org/TR/turtle/,对该页面中Turtle的内容部分进行翻译,希望对使用Turtle的朋友们有所帮助. 1 简介 2 Turtle语言 2.1 ...

  9. .net core 在网络高并发下提高JSON的处理效率

    现有的webapi一般都基于JSON的格式来处理数据,由于JSON是一个文本类的序列化协议所以在性能上自然就相对低效一些.在.net中常用Newtonsoft.Json是最常用的组件,由于提供简便基于 ...

  10. 【view绘制流程】理解

    一.概述 View的绘制是从上往下一层层迭代下来的.DecorView-->ViewGroup(--->ViewGroup)-->View ,按照这个流程从上往下,依次measure ...