快捷導(dǎo)航

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

更新時間：2017年01月30日 15:52:35 作者：aitangyong

這篇文章主要介紹了jQuery使用siblings獲取某元素所有同輩(兄弟姐妹)元素用法,結(jié)合簡單實例形式分析了siblings()函數(shù)獲取同輩元素的操作技巧,需要的朋友可以參考下

本文實例講述了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>

假如需要實現(xiàn)如下功能：點擊某個按鈕的時候，該按鈕背景色變成#88b828，其他按鈕背景色變成#15b494。這個時候，siblings這個API很有用，也很簡單。

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

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery頁面元素操作技巧匯總》、《jquery選擇器用法總結(jié)》、《jQuery表單操作總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jQuery擴(kuò)展技巧總結(jié)》及《jQuery常見經(jīng)典特效匯總》

希望本文所述對大家jQuery程序設(shè)計有所幫助。

您可能感興趣的文章:

相關(guān)文章

原生和jQuery的ajax用法詳解
Ajax被認(rèn)為是(Asynchronous(異步) JavaScript And Xml的縮寫）?，F(xiàn)在，允許瀏覽器與服務(wù)器通信而無須刷新當(dāng)前頁面的技術(shù)都被叫做Ajax。這篇文章主要介紹了原生和jQuery的ajax用法，需要的朋友參考下吧
2017-01-01
jQuery實現(xiàn)滑動頁面固定頂部顯示(可根據(jù)顯示位置消失與替換)
這篇文章主要介紹了jQuery實現(xiàn)滑動頁面固定頂部顯示,還可根據(jù)顯示位置消失與替換對應(yīng)的當(dāng)前顯示項,具有一定參考借鑒價值,需要的朋友可以參考下
2015-10-10
jQuery中Ajax的get、post等方法詳解
前面我們講述了jQuery中ajax的load（）方法，小伙伴們反應(yīng)非常好，今天我們就來講解下jQuery中Ajax的get、post等方法，希望大家同樣能夠喜歡。
2015-01-01
基于JQuery的模擬蘋果桌面Dock效果(穩(wěn)定版)
之所以將它命名為穩(wěn)定版，是因為之前已經(jīng)分享了一個初級版本的，之前的初級版中存在很多bug。現(xiàn)在經(jīng)過反復(fù)琢磨、實驗，修復(fù)了之前版本存在的很多不足之處，就算鼠標(biāo)快速的滑動依然表現(xiàn)的很穩(wěn)定
2012-10-10
JQuery 又談ajax局部刷新
這篇文章主要為大家詳細(xì)介紹了JQuery ajax局部刷新，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-11-11
validform表單驗證的實現(xiàn)方法
這篇文章主要介紹了validform表單驗證的實現(xiàn)方法，validform插件主要把所有的驗證條件和驗證提示信息綁定到每個表單元素，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2019-03-03
jQuery實現(xiàn)點擊自身以外區(qū)域關(guān)閉彈出層功能完整示例【改進(jìn)版】
這篇文章主要介紹了jQuery實現(xiàn)點擊自身以外區(qū)域關(guān)閉彈出層功能,結(jié)合具體實例形式分析了jQuery事件響應(yīng)及頁面元素屬性動態(tài)操作實現(xiàn)彈出層打開與關(guān)閉相關(guān)操作技巧,需要的朋友可以參考下
2018-07-07
jQuery-ui中自動完成實現(xiàn)方法
關(guān)于jQuery-ui-1.8中的自動完成控件，其匹配方式是使用正則表達(dá)式進(jìn)行匹配的。
2010-06-06
jQuery實現(xiàn)的感應(yīng)鼠標(biāo)懸停圖片色彩漸顯效果
這篇文章主要介紹了jQuery實現(xiàn)的感應(yīng)鼠標(biāo)懸停圖片色彩漸顯效果,涉及jQuery中hover、find、css等方法的使用技巧,需要的朋友可以參考下
2015-03-03
Jquery中val()表單取值賦值的實例代碼
在jquery中給表單取值或賦值的方法我們只要簡單的$(\'表單ID\').val()即可實現(xiàn)取值了，如果賦值我們可使用$(\'表單ID\').val(\'內(nèi)容\')即可實現(xiàn)了
2013-08-08