jQuery中siblings()方法用法實(shí)例
更新時(shí)間：2015年01月08日 09:57:24 投稿：shichen2014
這篇文章主要介紹了jQuery中siblings()方法用法,實(shí)例分析了siblings()方法的功能、定義及獲取匹配元素集合中每一個(gè)元素的同輩元素的使用技巧,是進(jìn)行元素篩選時(shí)非常實(shí)用的方法,需要的朋友可以參考下
本文實(shí)例講述了jQuery中siblings()方法用法。分享給大家供大家參考。具體分析如下：
此方法能夠獲取匹配元素集合中每一個(gè)元素的同輩元素。
同輩元素集合可以使用表達(dá)式進(jìn)行篩選。
語法結(jié)構(gòu):
復(fù)制代碼 代碼如下:
$(selector).siblings(expr)
參數(shù)列表:
實(shí)例代碼:
實(shí)例一:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.fzitv.net/" />
<title>siblings()函數(shù)-腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p").siblings().css("color","red")
})
</script>
</head>
<body>
<div class="first">
<p>我是first下的p</p>
<span>我是div下的span</span>
</div>
<div class="second">
<ul>
<li>我是li</li>
</ul>
<p>我是second下的p</p>
</div>
</body>
</html>
實(shí)例二:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.fzitv.net/" />
<title>siblings()函數(shù)-腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p").siblings("span").css("color","red")
})
</script>
</head>
<body>
<div class="first">
<p>我是first下的p</p>
<span>我是div下的span</span>
</div>
<div class="second">
<ul>
<li>我是li</li>
</ul>
<p>我是second下的p</p>
</div>
</body>
</html>
希望本文所述對大家的jQuery程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- jquery siblings獲取同輩元素用法實(shí)例分析
- jQuery中的siblings()是什么意思(推薦)
- 淺談jquery中next與siblings的區(qū)別
- 有關(guān)jQuery中parent()和siblings()的小問題
- jQuery siblings()用法實(shí)例詳解
- jquery遍歷函數(shù)siblings()用法實(shí)例
- jQuery中的siblings用法實(shí)例分析
- jquery next nextAll nextUntil siblings的區(qū)別介紹
- jQuery prev ~ siblings選擇器使用介紹
- jquery 層次選擇器siblings與nextAll的區(qū)別介紹
- 仿jQuery的siblings效果的js代碼
- jQuery使用siblings獲取某元素所有同輩(兄弟姐妹)元素用法示例
相關(guān)文章
jQuery移動(dòng)web開發(fā)中的頁面初始化與加載事件
這篇文章主要介紹了jQuery移動(dòng)web開發(fā)中的頁面初始化與加載事件,是JavaScript移動(dòng)端頁面開發(fā)學(xué)習(xí)中的基礎(chǔ)知識,需要的朋友可以參考下2015-12-12
jQuery實(shí)現(xiàn)一個(gè)簡單的輪播圖
本文主要介紹了jQuery實(shí)現(xiàn)一個(gè)簡單輪播圖的方法，具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-02-02
jQuery實(shí)現(xiàn)帶遮罩層效果的blockUI彈出層示例【附demo源碼下載】
這篇文章主要介紹了jQuery實(shí)現(xiàn)帶遮罩層效果的blockUI彈出層,可實(shí)現(xiàn)帶有彈出遮罩層效果的彈出對話框功能,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2016-09-09
jQuery使用hide()、toggle()函數(shù)實(shí)現(xiàn)相機(jī)品牌展示隱藏功能
這篇文章主要介紹了jQuery使用hide()、toggle()函數(shù)實(shí)現(xiàn)相機(jī)品牌展示隱藏功能,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-01-01
用jQuery簡化Ajax開發(fā)實(shí)現(xiàn)方法
使用 jQuery 將使 Ajax 變得及其簡單。jQuery 提供有一些函數(shù)，可以使簡單的工作變得更加簡單，復(fù)雜的工作變得不再復(fù)雜。2010-04-04
jQuery中對節(jié)點(diǎn)進(jìn)行操作的相關(guān)介紹
本篇文章小編將為大家介紹，在jQuery中對節(jié)點(diǎn)進(jìn)行操作的解決辦法，有需要的朋友可以參考一下2013-04-04
jquery 抽獎(jiǎng)小程序?qū)崿F(xiàn)代碼
這篇文章主要介紹了jquery 抽獎(jiǎng)小程序的相關(guān)資料,這里提供了詳細(xì)的思路及實(shí)現(xiàn)代碼和實(shí)現(xiàn)效果圖，需要的朋友可以參考下2016-10-10
jQuery實(shí)現(xiàn)公告新聞自動(dòng)滾屏效果實(shí)例代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)公告新聞自動(dòng)滾屏效果實(shí)例代碼的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-07-07
jQuery實(shí)現(xiàn)的淡入淡出與滑入滑出效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的淡入淡出與滑入滑出效果,結(jié)合實(shí)例形式分析了jQuery中fadeIn、fadeOut、slideDown及slideUp方法相關(guān)使用技巧,需要的朋友可以參考下2018-04-04
這篇文章主要介紹了jQuery formValidator表單驗(yàn)證 的相關(guān)資料,需要的朋友可以參考下2016-01-01