jquery遍历函数siblings()用法实例


Posted in Javascript onDecember 24, 2015

本文实例讲述了jquery遍历函数siblings()用法。分享给大家供大家参考,具体如下:

siblings([expr])

得到所有匹配元素集合中各个元素的所有兄弟元素集合。返回匹配元素集合

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
 <script src="jquery.js"></script>
 <script>
 $(document).ready(function(){
  var len = $(".hilite").siblings().css("color", "red").length;
  $("b").text(len);
 });
 </script>
 <style>
 ul { float:left; margin:5px; font-size:16px; font-weight:bold; }
 p { color:blue; margin:10px 20px; font-size:16px; padding:5px;
   font-weight:bolder; }
 .hilite { background:yellow; }
</style>
</head>
<body>
 <ul>
  <li>One</li>
  <li>Two</li>
  <li class="hilite">Three</li>
  <li>Four</li>
 </ul>
 <ul>
  <li>Five</li>
  <li>Six</li>
  <li>Seven</li>
 </ul>
 <ul>
  <li>Eight</li>
  <li class="hilite">Nine</li>
  <li>Ten</li>
  <li class="hilite">Eleven</li>
 </ul>
 <p>Unique siblings: <b></b></p>
</body>
</html>
$(".hilite").siblings()

将得到包含特殊样式‘hilite'元素的所有兄弟元素集合。以下是匹配元素集合

<li>One</li>
<li>Two</li>
<li>Four</li>
<li>Eight</li>
<li class="hilite">Nine</li>
<li>Ten</li>
<li class="hilite">Eleven</li>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript使用过程中需要注意的地方和一些基本语法
Aug 26 Javascript
如何使用jQuery Draggable和Droppable实现拖拽功能
Jul 05 Javascript
js调用后台、后台调用前台等方法总结
Apr 17 Javascript
关于JavaScript作用域你想知道的一切
Feb 04 Javascript
浅谈JavaScript 浏览器对象
Jun 03 Javascript
JavaScript对象引用与赋值实例详解
Mar 15 Javascript
Angular4学习笔记之新建项目的方法
Jul 18 Javascript
vue引用js文件的多种方式(推荐)
May 17 Javascript
浅谈vue.use()方法从源码到使用
May 12 Javascript
jQuery实现带进度条的轮播图
Sep 13 jQuery
Vue + ts实现轮播插件的示例
Nov 10 Javascript
vue 自定义的组件绑定点击事件
Apr 21 Vue.js
jQuery中的siblings用法实例分析
Dec 24 #Javascript
JQuery标签页效果实例详解
Dec 24 #Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记9)
Dec 24 #Javascript
JQuery实现Ajax加载图片的方法
Dec 24 #Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记8)
Dec 24 #Javascript
js中flexible.js实现淘宝弹性布局方案
Jun 23 #Javascript
正则表达式优化JSON字符串的技巧
Dec 24 #Javascript
You might like
php file_get_contents抓取Gzip网页乱码的三种解决方法
2013/11/12 PHP
php操作xml入门之cdata区段
2015/01/23 PHP
网页源代码保护(禁止右键、复制、另存为、查看源文件)
2012/05/23 Javascript
javascript 操作符(~、&amp;、|、^、)使用案例
2014/12/31 Javascript
jQuery超酷平面式时钟效果代码分享
2020/03/30 Javascript
JavaScript接口的实现三种方式(推荐)
2016/06/14 Javascript
详解Vue基于vue-quill-editor富文本编辑器使用心得
2019/01/03 Javascript
webpack项目使用eslint建立代码规范实现
2019/05/16 Javascript
微信小程序实现二维码签到考勤系统
2020/01/16 Javascript
EXTJS7实现点击拖拉选择文本
2020/12/17 Javascript
[52:52]DOTA2上海特级锦标赛C组资格赛#1 OG VS LGD第三局
2016/02/27 DOTA
python读写文件操作示例程序
2013/12/02 Python
Python获取当前时间的方法
2014/01/14 Python
Python 操作MySQL详解及实例
2017/04/30 Python
Python批量发送post请求的实现代码
2018/05/05 Python
TensorFlow实现模型评估
2018/09/07 Python
Python小游戏之300行代码实现俄罗斯方块
2019/01/04 Python
使用Django搭建网站实现商品分页功能
2020/05/22 Python
浅析Python迭代器的高级用法
2020/07/16 Python
基于opencv的selenium滑动验证码的实现
2020/07/24 Python
python如何爬取网页中的文字
2020/07/28 Python
Python限制内存和CPU使用量的方法(Unix系统适用)
2020/08/04 Python
关于HTML5的22个初级技巧(图文教程)
2012/06/21 HTML / CSS
如何使用html5与css3完成google涂鸦动画
2012/12/16 HTML / CSS
通过canvas转换颜色为RGBA格式及性能问题的解决
2019/11/22 HTML / CSS
红色连衣裙精品店:Red Dress Boutique
2018/08/11 全球购物
华美博弈C/VC工程师笔试试题
2012/07/16 面试题
市场营销职业生涯规划书范文
2014/01/12 职场文书
建筑专业毕业生自荐信
2014/05/25 职场文书
预备党员公开承诺书
2014/05/28 职场文书
企业群众路线教育实践活动心得体会
2014/11/03 职场文书
2015年煤矿工作总结
2015/04/28 职场文书
社区党支部公开承诺书
2015/04/29 职场文书
tensorflow+k-means聚类简单实现猫狗图像分类的方法
2021/04/28 Python
一次线上mongo慢查询问题排查处理记录
2022/03/18 MongoDB
MySQL解决Navicat设置默认字符串时的报错问题
2022/06/16 MySQL