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 ...
随机推荐
- YAML基础教程
一.YAML介绍YAML参考了其他多种语言,包括:XML.C语言.Python.Perl以及电子邮件格式RFC2822.Clark Evans在2001年5月在首次发表了这种语言,另外Ingy döt ...
- Ubuntu18.04(linux)安装MySQL
安装 mysql sudo apt-get --purge remove mysql-server mysql-common mysql-client sudo apt-get install mys ...
- [Active Learning] 01 A Brief Introduction to Active Learning 主动学习简介
目录 什么是主动学习? 主动学习 vs. 被动学习 为什么需要主动学习? 主动学习与监督学习.弱监督学习.半监督学习.无监督学习之间的关系 主动学习的种类 主动学习的一个例子 主动学习工具包 ALiP ...
- 面试挂在了 LRU 缓存算法设计上
好吧,有人可能觉得我标题党了,但我想告诉你们的是,前阵子面试确实挂在了 RLU 缓存算法的设计上了.当时做题的时候,自己想的太多了,感觉设计一个 LRU(Least recently used) 缓存 ...
- 两个月的Java实习结束,继续努力
前言 只有光头才能变强 2018年8月30日,今天我辞职了.在6月25号入职,到现在也有两个月时间了. 感受: 第一天是期待的:第一次将项目拉到本地上看的时候,代码很多,有非常多的模块,模块下又有da ...
- DSAPI DS密法
DS密法是DYLIKE本人研发的一种针对文本字符串的高强度加密方法,本加密方法的优点是同源不同密,同一个源文本每次加密的结果都不同,长度也不同.密钥最大可达String类型的字符最大长度.缺点是解密时 ...
- ASP .NET SignalR起步
在网站开发中,时常需要使用消息推送功能,http协议是无状态连接,我们需要一个类似桌面程序中socket保持服务器和客户端连接的技术.signalr就是这样一个技术,他能保持网站页面和服务器的一个长连 ...
- 【原创】详细案例解剖——浅谈Redis缓存的常用5种方式(String,Hash,List,set,SetSorted )
很多小伙伴没接触过Redis,以至于去学习的时候感觉云里雾里的,就有一种:教程随你出,懂了算我输的感觉. 每次听圈内人在谈论的时候总是插不上话,小编就偷偷去了解了一下,也算是初入门径. 然后就整理了一 ...
- 理解ScheduledExecutorService中scheduleAtFixedRate和scheduleWithFixedDelay的区别
scheduleAtFixedRate 每间隔一段时间执行,分为两种情况: 当前任务执行时间小于间隔时间,每次到点即执行: /** * 任务执行时间(8s)小于间隔时间(10s) */ public ...
- 18 章 CSS 链接、光标、 DHTML 、缩放
1.CSS 中链接的使用 2.CSS 中光标的使用 3.CSS 中 DHTML 的使用 4.CSS 中缩放的使用 1 18 8. .1 1 S CSS 中 链接的使用 超链接伪类属性 a:link ...