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 相关文章推荐
js中几种去掉字串左右空格的方法
Dec 25 Javascript
基于node.js的快速开发透明代理
Dec 25 Javascript
JavaScript+CSS实现仿天猫侧边网页菜单效果
Aug 25 Javascript
JS实现仿FLASH效果的竖排导航代码
Sep 15 Javascript
跟我学习javascript的基本类型和引用类型
Nov 16 Javascript
基于jquery实现即时检查格式是否正确的表单
May 06 Javascript
jQuery Dom元素操作技巧
Feb 04 jQuery
JS加密插件CryptoJS实现AES加密操作示例
Aug 16 Javascript
web页面和微信小程序页面实现瀑布流效果
Sep 26 Javascript
JS 封装父页面子页面交互接口的实例代码
Jun 25 Javascript
浅谈小程序globalData的那些事儿
Nov 01 Javascript
vue使用echarts画组织结构图
Feb 06 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中文字母数字验证码实现代码
2008/04/25 PHP
PHP获取网站域名和地址的代码
2008/08/17 PHP
php &amp;&amp; 逻辑与运算符使用说明
2010/03/04 PHP
PHP substr 截取字符串出现乱码问题解决方法[utf8与gb2312]
2011/12/16 PHP
php处理restful请求的路由类分享
2014/02/27 PHP
用PHP解决的一个栈的面试题
2014/07/02 PHP
微信红包随机生成算法php版
2016/07/21 PHP
Yii2框架实现登陆添加验证码功能示例
2018/07/12 PHP
一段多浏览器的&quot;复制到剪贴板&quot;javascript代码
2007/03/27 Javascript
不同浏览器对回车提交表单的处理办法
2010/02/13 Javascript
javascript中IE浏览器不支持NEW DATE()带参数的解决方法
2012/03/01 Javascript
iframe窗口高度自适应的又一个巧妙实现思路
2014/04/04 Javascript
javascript自定义的addClass()方法
2014/05/28 Javascript
实现js保留小数点后N位的代码
2014/11/13 Javascript
BootStrap中Tab页签切换实例代码
2016/05/30 Javascript
jQuery 中ajax异步调用的四种方式
2016/06/28 Javascript
jQuery获取选中单选按钮radio的值
2016/12/27 Javascript
JS求解三元一次方程组值的方法
2017/01/03 Javascript
关于angular js_$watch监控属性和对象详解
2017/04/24 Javascript
jQuery中hover方法搭配css的hover选择器,实现选中元素突出显示方法
2017/05/08 jQuery
[05:15]2018年度CS GO社区贡献奖-完美盛典
2018/12/16 DOTA
python爬虫入门教程之点点美女图片爬虫代码分享
2014/09/02 Python
python爬虫使用cookie登录详解
2017/12/27 Python
python读取几个G的csv文件方法
2019/01/07 Python
Pymysql实现往表中插入数据过程解析
2020/06/02 Python
HTML5的标签的代码的简单介绍 HTML5标签的简介
2012/05/28 HTML / CSS
html5使用canvas画空心圆与实心圆
2014/12/15 HTML / CSS
Jeep牧马人、切诺基和自由人零配件:4 Wheel Drive Hardware
2017/07/02 全球购物
伦敦高达60%折扣的钻石珠宝商:Purely Diamonds
2018/06/24 全球购物
.NET是怎么支持多种语言的
2015/02/24 面试题
描述RIP和OSPF区别以及特点
2015/01/17 面试题
计算机操作自荐信
2013/12/07 职场文书
爱护公物标语
2014/06/24 职场文书
校长四风对照检查材料
2014/09/27 职场文书
2015元旦家电促销活动策划方案
2014/12/09 职场文书
继续教育心得体会(共6篇)
2016/01/19 职场文书