jquery中子元素和后代元素的區(qū)別示例介紹
更新時間:2014年04月02日 15:43:10 作者:
后代,就是當前元素的所有后代,都算,子元素,就是當前元素的子集,再往下走就不算了
今天學習jQuery的選擇器:
jQuery選擇器分為基本選擇器、層次選擇器、過濾選擇器、表單選擇器。
基本選擇器:id,class,標簽名,*,元素組合(div,span,p.myClass)
層次選擇器:
難點: jquery中子元素和后代元素的區(qū)別
后代,就是當前元素的所有后代,都算,
子元素,就是當前元素的子集,再往下走就不算了。
具體的分析可以參考:
<div>This is <strong>very</strong> important.</div>
<div>This is <em>really <strong>very</strong></em> important.</div>
以上是html。運行后在瀏覽器里是看到
This is very important.
This is really very important.
這樣的樣式,為了容易看到效果,我們不妨就嘗試用添加css顏色來試一下
如果運行$("div strong").css("color","red");就是把div的后代元素strong變?yōu)榧t色。運行后是
This is very important.
This is really very important.
如果運行$("div>strong").css("color","blue");就是把div的子元素strong變?yōu)樗{色。運行后是
This is very important.
This is really very important.
可以通俗的這樣理解,例如有一家人三代同堂,爺爺,父親和你,這樣話爺爺?shù)淖釉鼐褪悄愀赣H,同時你父親也是爺爺?shù)暮蟠?,而你只是爺爺?shù)暮蟠亍?
jQuery選擇器分為基本選擇器、層次選擇器、過濾選擇器、表單選擇器。
基本選擇器:id,class,標簽名,*,元素組合(div,span,p.myClass)
層次選擇器:
難點: jquery中子元素和后代元素的區(qū)別
后代,就是當前元素的所有后代,都算,
子元素,就是當前元素的子集,再往下走就不算了。
具體的分析可以參考:
復制代碼 代碼如下:
<div>This is <strong>very</strong> important.</div>
<div>This is <em>really <strong>very</strong></em> important.</div>
以上是html。運行后在瀏覽器里是看到
This is very important.
This is really very important.
這樣的樣式,為了容易看到效果,我們不妨就嘗試用添加css顏色來試一下
如果運行$("div strong").css("color","red");就是把div的后代元素strong變?yōu)榧t色。運行后是
This is very important.
This is really very important.
如果運行$("div>strong").css("color","blue");就是把div的子元素strong變?yōu)樗{色。運行后是
This is very important.
This is really very important.
可以通俗的這樣理解,例如有一家人三代同堂,爺爺,父親和你,這樣話爺爺?shù)淖釉鼐褪悄愀赣H,同時你父親也是爺爺?shù)暮蟠?,而你只是爺爺?shù)暮蟠亍?
相關(guān)文章
jQuery分頁插件jquery.pagination.js使用方法解析
這篇文章主要為大家詳細解析了jQuery分頁插件jquery.pagination使用方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-02-02
JQuery Ajax執(zhí)行跨域請求數(shù)據(jù)的解決方案
今天小編就為大家分享一篇關(guān)于JQuery Ajax執(zhí)行跨域請求數(shù)據(jù)的解決方案,小編覺得內(nèi)容挺不錯的,現(xiàn)在分享給大家,具有很好的參考價值,需要的朋友一起跟隨小編來看看吧2018-12-12
jQuery中attr()與prop()函數(shù)用法實例詳解(附用法區(qū)別)
這篇文章主要介紹了jQuery中attr()與prop()函數(shù)用法,結(jié)合實例形式詳細分析了attr()與prop()函數(shù)的使用技巧與相關(guān)注意事項,并附帶了attr()與prop()函數(shù)用法的區(qū)別,需要的朋友可以參考下2015-12-12
jQuery獲取及設(shè)置表單input各種類型值的方法小結(jié)
這篇文章主要介紹了jQuery獲取及設(shè)置表單input各種類型值的方法,總結(jié)分析了jQuery針對表單元素的各種常見操作技巧,非常簡單實用,需要的朋友可以參考下2016-05-05
jQuery動畫顯示和隱藏效果實例演示(附demo源碼下載)
這篇文章主要介紹了jQuery動畫顯示和隱藏效果實現(xiàn)方法,并附帶了demo源碼供讀者下載參考,涉及jQuery操作圖片的顯示,隱藏及淡入淡出等效果,需要的朋友可以參考下2015-12-12
JQuery實現(xiàn)倒計時按鈕的實現(xiàn)代碼
頁面中需要實現(xiàn)某個按鈕點擊完后,禁用它,并顯示倒計時。這個默認是3秒,代碼很簡單2012-03-03
基于JQuery的數(shù)字改變的動畫效果--可用來做計數(shù)器
之前用javascript做個計數(shù)器,從網(wǎng)上搜了搜,找不到合適的,就想著用jquery自己做一個2010-08-08

