本文實(shí)例講述了jQuery子選擇器與可見性選擇器。分享給大家供大家參考，具體如下：

子元素選擇器與可見性選擇器

子元素選擇器是允許利用子元素的位置進(jìn)行獲取的選擇器

子內(nèi)容選擇器3種用法

• E:first-child
  • 選擇所有位于其父元素第一個(gè)位置的E元素
• E:last-child
  • 選擇所有位于其父元素最后一個(gè)位置的E元素
• E:nth-child(n)
  • 選擇所有位于其父元素指定位置的E元素,n從1開始

可見性選擇器,顧名思義就是獲取當(dāng)前頁面可見/不可見的元素

可見性選擇器用法如下:

• E:hidden
  • 選擇所有不可見的元素
  • 隱藏域、display=”none”、width與height=0的元素都會(huì)被選中
• E:visible
  • 選擇所有可見元素

如操作：

• 出現(xiàn)在其父元素第一個(gè)位置的li元素
• 出現(xiàn)在其父元素最后一個(gè)位置的li元素
• 出現(xiàn)在其父元素第三個(gè)位置的li元素
• 所有可顯示的元素

<script>$(function(){  //出現(xiàn)在其父元素第一個(gè)位置的li元素  //$("li:first-child").css("border" , "1px solid red");  //出現(xiàn)在其父元素最后一個(gè)位置的li元素  //$("li:last-child").css("border" , "1px solid red");  //$("ul>li:last").css("border" , "1px solid red");  //nth-child(n)來獲取指定位置的li元素,nth-child(n)從1開始,第三個(gè)元素就是3.而以前學(xué)習(xí)過的:eq(n)是從0開始的,請(qǐng)注意區(qū)分  //$("li:nth-child(3)").css("border" , "1px solid red");  //獲取所有可顯示的元素  $(":visible").css("border" , "1px solid red");})</script>

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

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