jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法示例


Posted in Javascript onJanuary 30, 2017

本文实例讲述了jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法。分享给大家供大家参考,具体如下:

siblings()属于jQuery筛选类的API,用来查找某个元素的所有同辈元素(所有兄弟姐妹)。

<div id="contentHolder">
  <input type="button" value="1" id="button1"></input>
  <input type="button" value="2" id="button2"></input>
  <input type="button" value="3" id="button3"></input>
</div>

假如需要实现如下功能:点击某个按钮的时候,该按钮背景色变成#88b828,其他按钮背景色变成#15b494。这个时候,siblings这个API很有用,也很简单。

$(function(){
  $("#contentHolder input[type='button']").click(function(){
    $(this).css("background","#88b828");
    $(this).siblings().css("background","#15b494");
  });
})

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

Javascript 相关文章推荐
读jQuery之一(对象的组成)
Jun 11 Javascript
js去除空格的12种实用方法
Nov 08 Javascript
Jquery Ajax方法传值到action的方法
May 11 Javascript
JS 获取鼠标左右键的键值方法
Oct 11 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记6)
Dec 20 Javascript
js实现固定宽高滑动轮播图效果
Jan 13 Javascript
jQuery.form.js的使用详解
Jun 14 jQuery
JS中使用media实现响应式布局
Aug 04 Javascript
Vue2.0基于vue-cli+webpack同级组件之间的通信教程(推荐)
Sep 14 Javascript
Bootstrap 中data-[*] 属性的整理
Mar 13 Javascript
判断iOS、Android以及PC端的示例代码
Nov 15 Javascript
javascript Canvas动态粒子连线
Jan 01 Javascript
AngularJS报错$apply already in progress的解决方法分析
Jan 30 #Javascript
JavaScript基础之AJAX简单的小demo
Jan 29 #Javascript
JavaScript Date 知识浅析
Jan 29 #Javascript
JavaScript实现时钟滴答声效果
Jan 29 #Javascript
Javascript中 带名 匿名 箭头函数的重要区别(推荐)
Jan 29 #Javascript
jQuery图片轮播功能实例代码
Jan 29 #Javascript
jQuery代码实现实时获取时间
Jan 29 #Javascript
You might like
PHP中ADODB类详解
2008/03/25 PHP
使用PHPMyAdmin修复论坛数据库的图文方法
2012/01/09 PHP
使用swoole扩展php websocket示例
2014/02/13 PHP
ThinkPHP3.1新特性之字段合法性检测详解
2014/06/19 PHP
thinkphp项目如何自定义微信分享描述内容
2017/02/20 PHP
Javascript实现的类似Google的Div拖动效果代码
2011/08/09 Javascript
使用jQuery异步加载 JavaScript脚本解决方案
2014/04/20 Javascript
js闭包实例汇总
2014/11/09 Javascript
js库Modernizr的介绍和使用
2015/05/07 Javascript
js判断文本框输入的内容是否为数字
2015/12/23 Javascript
Javascript字符串拼接小技巧(推荐)
2016/06/02 Javascript
谈谈VUE种methods watch和compute的区别和联系
2017/08/01 Javascript
vue中$nextTick的用法讲解
2019/01/17 Javascript
jQuery高级编程之js对象、json与ajax用法实例分析
2019/11/01 jQuery
python实现在pandas.DataFrame添加一行
2018/04/04 Python
python 输出上个月的月末日期实例
2018/04/11 Python
python的格式化输出(format,%)实例详解
2018/06/01 Python
python按照多个条件排序的方法
2019/02/08 Python
Python OpenCV调用摄像头检测人脸并截图
2020/08/20 Python
python将邻接矩阵输出成图的实现
2019/11/21 Python
django2.2 和 PyMySQL版本兼容问题
2020/02/17 Python
vue常用指令代码实例总结
2020/03/16 Python
PythonPC客户端自动化实现原理(pywinauto)
2020/05/28 Python
利用CSS3的定位页面元素
2009/08/29 HTML / CSS
详解CSS3的opacity属性设置透明效果的用法
2016/05/09 HTML / CSS
法国隐形眼镜网站:VisionDirect.fr
2020/03/03 全球购物
经典演讲稿范文
2013/12/30 职场文书
函授药学自我鉴定
2014/02/07 职场文书
汉语言文学职业规划
2014/02/14 职场文书
少儿节目主持串词
2014/04/02 职场文书
市级三好学生事迹材料
2014/08/27 职场文书
城管执法人员纪律作风整顿思想汇报
2014/09/13 职场文书
2015年酒店客房部工作总结
2015/04/25 职场文书
vue使用v-model进行跨组件绑定的基本实现方法
2021/04/28 Vue.js
MySQL COUNT函数的使用与优化
2021/05/10 MySQL
Python学习之包与模块详解
2022/03/19 Python