jquery获取元素(父级的兄弟元素的子元素)
一、获取父级元素
使用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获取元素(父级的兄弟元素的子元素)的更多相关文章
- jQuery获取所有父级元素及同级元素及子元素的方法
jQuery获取所有父级元素及同级元素及子元素的方法 1.获取父级元素 $("#id").parent() 获取其父级元素 $("#id").parents() ...
- IE6下绝对定位元素父级宽高是奇数,绝对定位元素的right和bottom值会有1个像素的偏差
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 当父级是body时,子元素设置position:absolute;定位是根据body还是html呢?
position:absolute 元素相对最近的 position 为 absolute / relative / fixed 的祖先元素(包含块)定位,如果没有这样的祖先元素,则以初始包含块进行定 ...
- Java IO,io,文件操作,删除文件,删除文件夹,获取文件父级目录
Java IO,io,文件操作,删除文件,删除文件夹,获取文件父级目录 这里先简单的贴下常用的方法: File.separator //当前系统文件分隔符 File.pathSeparator // ...
- jQuery 父级,祖先,兄弟,等选择性操作
jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(&q ...
- jquery的父级和兄弟级能做多少网页特效
这里说的父级就是parent 兄弟级就是siblings 我这里说一个导航栏用到的特效 主要jquery代码$(this).parent().addClass(“active”).siblings( ...
- ie7 父元素宽度自适应且为浮动的话 子元素的宽度将不能按比例设置问题
好久没切图,昨天遇到个浏览器兼容的老问题,在ie7下,父元素设置浮动后,其宽度是自适应的,子元素的宽度若没有确定则将显示最小宽度,即文本所占的宽度. 正常其他浏览器显示如下: ie7中显示效果如下: ...
- SQL根据指定节点ID获取所有父级节点和子级节点
--根据指定节点ID获取所有子节点-- WITH TEMP AS ( SELECT * FROM table_name WHERE Id=' --表的主键ID UNION ALL SELECT T0. ...
- SQL根据指定节点ID获取所有父级节点和子级节点(转载)
--根据指定节点ID获取所有子节点-- WITH TEMP AS ( ' --表的主键ID UNION ALL SELECT T0.* FROM TEMP,table_name T0 WHERE TE ...
随机推荐
- 【BZOJ 3626】 [LNOI2014]LCA【在线+主席树+树剖】
题目链接: TP 题解: 可能是我比较纱布,看不懂题解,只好自己想了…… 先附一个离线版本题解[Ivan] 我们考虑对于询问区间是可以差分的,然而这并没有什么卵用,然后考虑怎么统计答案. 首先LC ...
- 『性能』List 和 HashSet 查找性能比较 (任何数据量的检索 从此只用 HashSet )
结论: 总数 50000 (5万): List 检索 5W次 耗时 23秒, HashSet 检索 5W次 耗时 0.01秒. 总数 5000 (5千): List 检索 5K次 耗时 0.16秒 ...
- 【.NETCore开源】开弓没有回头箭
2019.2.11 开工大吉!经过了半个月的休假,今天回归岗位重新拾起工作,却发现熟悉的代码生疏了.年前的计划回忆不起来了,俗称"节后综合症". 忆半月圈子 过年放假的前几天有多篇 ...
- kubernetes实践之五:深入理解Service及内部DNS搭建
一.Service存在的意义: 防止Pod失联(服务发现) 定义一组Pod的访问策略(负载均衡) 支持ClusterIP,NodePort以及LoadBalancer三种类型 Service的底层实现 ...
- traefik 结合 docker-compose 的快速安装及使用
traefik 介绍 traefik 是一个为了让部署微服务更加便捷而诞生的现代HTTP反向代理.负载均衡工具. 它支持多种后台 (Docker, Swarm, Kubernetes, Maratho ...
- css中的position(定位)
一.position语法与结构 position语法: position : static absolute relative position参数:static : 无特殊定位,对象遵循HTML定位 ...
- SQLite新建数据库及txt文件(CSV文件)导入
1.安装准备: Windows系统环境: 安装:SQLiteExpert 及 官网的SQLite tool 我们要用到其中的SQLite.exe 地址:https://www.sqli ...
- 我的IDEA配置
记录一下我的IDEA配置 图片看不清可以在新的标签页打开,因为被我压缩过了 目录: 1.插件 2.配置 一.插件 1.装逼类 (1)Power Mode II 写代码有飘落的像素效果,增加趣味性,因为 ...
- 关于inet_addr() 函数
inet_addr() 将一个字符串格式的ip地址转换成一个uint32_t数字格式 但是需要注意的是, 这个函数的返回值在大小端机器上是不同的 例如输入一个"192.168.0.1&quo ...
- Redux进阶(一)
State的不可变化带来的麻烦 在用Redux处理深度复杂的数据时会有一些麻烦.由于js的特性,我们知道当对一个对象进行复制时实际上是复制它的引用,除非你对这个对象进行深度复制.Redux要求你每次你 ...