jQuery中的siblings用法实例分析
本文实例讲述了jQuery中的siblings用法。分享给大家供大家参考,具体如下:
所谓siblings,英文翻译就是兄弟节点。那么故名思意,就是拿到某元素的兄弟节点(不包括自己)。
<html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> </head> <body> <ul> <li>li1</li> <li>li2</li> <li id="li3">li3</li> <li>li4</li> <li>li5</li> </ul> <script> $("#li3").siblings("li").css("backgroundcolor", "yellow"); </script> </body> </html>
我们还知道,
$("#li3").siblings("li").css("backgroundcolor", "yellow")
在本例中可以写成
$("#li3").siblings().css("backgroundcolor", "yellow")
默认拿和它自己相同的兄弟元素。
希望本文所述对大家jQuery程序设计有所帮助。
相关推荐
-
jquery 层次选择器siblings与nextAll的区别介绍
HTML代码: 复制代码 代码如下: <div> <div >1</div> <div class="one"> 2 <div>2_1 <div>2_1_1</div> </div> <div>2_2</div> </div> <div>3</div> <div>4</div> </div> $(
-
jquery next nextAll nextUntil siblings的区别介绍
next:紧挨着$('')的一个元素 nextAll:在$('')以后的所有的同辈元素 nextUntil:until有直到...之前的意思,所以他表示$('')以后的所有的同辈元素,不过要在nextUntil参数之前,不包括匹配的元素本身 sibings:$('')前后的所有同辈元素 简单理解就是,next就是找他的弟弟/妹妹,nextAll就是找他所有的弟弟/妹妹,nextUntil就是找比他小一定年龄的弟弟/妹妹,siblings就是找他所有的哥哥/姐姐,还有他的所有的弟弟/妹妹.所以同理
-
jquery siblings获取同辈元素用法实例分析
本文实例讲述了jquery siblings获取同辈元素用法.分享给大家供大家参考,具体如下: jquery siblings 用于获得匹配集合中每个元素的同胞. 语法: .siblings(selector) 注:可以通过后面的可选参数选择器(selector)进行进一步筛选. 示例: 找到每个div的所有同辈元素. <p>Hello</p> <div> <span>www.jb51.net</span> </div> <p&
-
浅谈jquery中next与siblings的区别
siblings([expr]): 概述 取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合. [expr] :可以用可选的表达式进行筛选.用于筛选同辈元素的表达式 示例 找到每个div的所有同辈元素. HTML 代码: <p>Hello</p><div><span>Hello Again</span></div><p>And Again</p> jQuery 代码: $("div
-
jQuery siblings()用法实例详解
siblings() 获得匹配集合中每个元素的同胞,通过选择器进行筛选是可选的. jQuery 的遍历方法siblings() $("给定元素").siblings(".selected") 其作用是筛选给定的同胞同类元素(不包括给定元素本身) 例子:网页选项栏 当点击任意一个选项卡是,其他2个选项卡就会改变样式,其内容也会隐藏. 下面是html代码. <body> <ul id="menu"> <li class=
-
仿jQuery的siblings效果的js代码
复制代码 代码如下: function siblings(o){//参数o就是想取谁的兄弟节点,就把那个元素传进去 var a=[];//定义一个数组,用来存o的兄弟元素 var p=o.previousSibling; while(p){//先取o的哥哥们 判断有没有上一个哥哥元素,如果有则往下执行 p表示previousSibling if(p.nodeType===1){ a.push(p); } p=p.previousSibling//最后把上一个节点赋给p } a.reverse()
-
有关jQuery中parent()和siblings()的小问题
今天发现一个小问题,现在也不知道到底是哪个梗在作祟,但是感觉是parent()和siblings()其中的一个. 我是想这样的根据输入的条件删选内容: demo: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="http://co
-
jQuery中siblings()方法用法实例
本文实例讲述了jQuery中siblings()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够获取匹配元素集合中每一个元素的同辈元素. 同辈元素集合可以使用表达式进行筛选. 语法结构: 复制代码 代码如下: $(selector).siblings(expr) 参数列表: 参数 描述 expr 可选.用于筛选同辈元素的表达式. 实例代码: 实例一: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta chars
-
jQuery prev ~ siblings选择器使用介绍
1.prev ~ siblings:匹配 prev 元素之后的所有 siblings 元素 2.(1)prev:任何有效选择器 (2)siblings:一个选择器,并且它作为第一个选择器的同辈 3.示例 (1)源码 siblings.html 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-t
-
jQuery中的siblings()是什么意思(推荐)
定义和用法 jQuery siblings() 方法返回被选元素的所有同胞元素,并且可以使用可选参数来过滤对同胞元素的搜索. 实例演示:点击某个li标签后将其设置为红色,而其所有同胞元素去除红色样式. 1.创建Html元素 <div class="box"> <span>点击li元素设置红色并去除其余所有同胞元素的红色样式:</span> <div class="content"> <li>栗子</l
-
jquery遍历函数siblings()用法实例
本文实例讲述了jquery遍历函数siblings()用法.分享给大家供大家参考,具体如下: siblings([expr]) 得到所有匹配元素集合中各个元素的所有兄弟元素集合.返回匹配元素集合 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> &l
-
jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法示例
本文实例讲述了jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法.分享给大家供大家参考,具体如下: siblings()属于jQuery筛选类的API,用来查找某个元素的所有同辈元素(所有兄弟姐妹). <div id="contentHolder"> <input type="button" value="1" id="button1"></input> <inpu
随机推荐
- 矩形相交以及求出相交的区域的原理解析
- 深入浅析Orcale的nvl函数和SQL Server的isnull函数
- 解决extjs grid 不随窗口大小自适应的改变问题
- .NET命令行解析器示例程序(命令行选项功能)
- php输出图像的方法实例分析
- PHP新特性之字节码缓存和内置服务器
- php控制文件下载速度的方法
- asp删除mssql数据库中没有记录的图片代码
- JavaScript字符串对象split方法入门实例(用于把字符串分割成数组)
- 页面利用渐进式JPEG来提升用户体验度
- 非常不错的列出sql服务器上所有数据库的asp代码
- 当ListView有Header时 onItemClick里的position不正确的原因
- Android中Viewpager禁止滑动的实现
- 常用的Javascript数据验证插件
- android 通过MediaRecorder实现简单的录音示例
- Android自定义圆角ImageView控件
- PHP中str_replace函数使用小结
- PHP获取数组最后一个值的2种方法
- 从源码分析Android的Volley库的工作流程
- Unity3D选择本地图片并加载