jQuery中parents()和parent()的區(qū)別分析
本文實(shí)例分析了jQuery中parents()和parent()的區(qū)別,分享給大家供大家參考。具體分析如下:
其實(shí)在jQuery中,函數(shù)或者選擇器的概念都是很容易理解的,只要對(duì)API手冊(cè)有足夠的熟練就能夠很容易分辨,標(biāo)題中的函數(shù)其實(shí)也是如此,不過咱們這里還是做一些簡(jiǎn)單的介紹,畢竟這樣可能更為方便一些。
一.parents()函數(shù):
此函數(shù)能夠獲取匹配元素的所有父元素,代碼示例:
以上代碼可以將所有class屬性值為"mayi"的元素的所有父級(jí)元素的字體顏色設(shè)置為紅色。
看一段完整的代碼實(shí)例:
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>計(jì)算被選中復(fù)選框的數(shù)量-腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".mayi").parents().css("color","red");
})
</script>
</head>
<body>
<div>
腳本之家一
<div>
腳本之家一一
<span class="mayi">腳本之家歡迎您</span>
</div>
</div>
</body>
</html>
以上代碼可以將span元素的所有父元素中的字體顏色設(shè)置為紅色。
二.parent()函數(shù):
此函數(shù)能夠能夠獲取所有匹配元素的一級(jí)父元素,而不是所有父元素。
以上代碼可以將class屬性值為mayi的元素的一級(jí)父元素中的字體顏色設(shè)置為紅色。
看一段完整的代碼:
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>計(jì)算被選中復(fù)選框的數(shù)量-腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".mayi").parent().css("color","red");
})
</script>
</head>
<body>
<div>
腳本之家一
<div>
腳本之家一一
<span class="mayi">腳本之家歡迎您</span>
</div>
</div>
</body>
</html>
以上代碼只能夠span元素的一級(jí)父元素中的"腳本之家一一"的字體顏色設(shè)置為紅色。
這兩個(gè)函數(shù)的最大區(qū)別就是父元素的返回,從函數(shù)的名稱也能夠感知到,帶有s能夠獲取所有的父元素,沒有s的只能夠獲取一級(jí)父元素,很簡(jiǎn)單這里就不多介紹了,感興趣的朋友可以參閱相關(guān)文章。
希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。
- jquery遍歷之parent()和parents()的區(qū)別及parentsUntil()方法詳解
- jQuery向上遍歷DOM樹之parents(),parent(),closest()之間的區(qū)別
- jquery中的查找parents與closest方法之間的區(qū)別
- jquery parent和parents的區(qū)別分析
- jQuery 遍歷- 關(guān)于closest() 的方法介紹以及與parents()的方法區(qū)別分析
- jQuery對(duì)val和atrr("value")賦值的區(qū)別介紹
- JQuery中的html()、text()、val()區(qū)別示例介紹
- 淺析JQuery中的html(),text(),val()區(qū)別
- jquery中$(#form :input)與$(#form input)的區(qū)別
- jQuery中attr()和prop()在修改checked屬性時(shí)的區(qū)別
- jquery中map函數(shù)與each函數(shù)的區(qū)別實(shí)例介紹
相關(guān)文章
jQuery實(shí)現(xiàn)Twitter的自動(dòng)文字補(bǔ)齊特效
本文介紹了一款jQuery實(shí)現(xiàn)的文字自動(dòng)補(bǔ)全特效的插件,該插件可以結(jié)合本地?cái)?shù)據(jù)進(jìn)行一些操作。推薦關(guān)注一下H5的幾種數(shù)據(jù)存儲(chǔ)的方式(localstorage與sessionstorage、IndexedDB、離線緩存manifest文件)2014-11-11jQuery.query.js 取參數(shù)的兩點(diǎn)問題分析
最近在項(xiàng)目中使用jQuery.query.js這個(gè)插件進(jìn)行頁面間URL傳值,遇到如下兩點(diǎn)問題2012-08-08jQuery實(shí)現(xiàn)根據(jù)類型自動(dòng)顯示和隱藏表單
這篇文章主要給大家分享了jQuery實(shí)現(xiàn)根據(jù)類型自動(dòng)顯示和隱藏表單的代碼,非常的簡(jiǎn)單實(shí)用,僅僅10行代碼,推薦給大家,希望能給大家一些提示。2015-03-03jquery實(shí)現(xiàn)tab鍵進(jìn)行選擇后enter鍵觸發(fā)click行為
本文主要介紹了jquery鍵盤事件實(shí)現(xiàn)tab鍵進(jìn)行選擇后enter鍵觸發(fā)click行為的方法,這種使用場(chǎng)景為當(dāng)首頁有幾個(gè)鏈接需要選擇的時(shí)候,使用鍵盤就可以進(jìn)行觸發(fā)行為。下面跟著小編一起來看下吧2017-03-03jQuery增加和刪除表格項(xiàng)目及實(shí)現(xiàn)表格項(xiàng)目排序的方法
jQuery對(duì)表格的操作是老生常談的問題了,各種插件也到處都是,這里我們還是來從技術(shù)著手jQuery增加和刪除表格項(xiàng)目及實(shí)現(xiàn)表格項(xiàng)目排序的方法:2016-05-05jquery 中ajax執(zhí)行的優(yōu)先級(jí)
本文給大家講述的是個(gè)人再做用戶注冊(cè)的時(shí)候遇到的ajax執(zhí)行優(yōu)先級(jí)的問題,以及在網(wǎng)友們的幫助下,解決此問題的全過程,這里記錄下來,分享給大家。2015-06-06jQuery-onload讓第一次頁面加載時(shí)圖片是淡入方式顯示
第一次打開一個(gè)頁面時(shí),讓加載好的圖片先隱藏,然后再執(zhí)行動(dòng)畫fadeIn,這里的load事件:當(dāng)所有子元素已經(jīng)被完全加載完成時(shí),load事件被發(fā)送到這個(gè)元素2012-05-05