jQuery內(nèi)容篩選選擇器實(shí)例代碼
本文實(shí)例為大家分享了jQuery內(nèi)容篩選選擇器的具體代碼,供大家參考,具體內(nèi)容如下
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title></title> <link rel="stylesheet" href="imooc.css" type="text/css"> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <h2>內(nèi)容篩選器</h2> <h3>:contains/:has</h3> <div class="left"> <div class="div"> <p>:contains</p> </div> <div class="div"> <p>:contains</p> </div> <div class="div"> <p> <span>:has</span> </p> </div> <div class="div"> <p>:contains</p> </div> </div> <script type="text/javascript"> //查找所有class='div'中DOM元素中包含"contains"的元素節(jié)點(diǎn) //并且設(shè)置顏色 $(".div:contains(':contains')").css("color", "#CD00CD"); </script> <script type="text/javascript"> //查找所有class='div'中DOM元素中包含"span"的元素節(jié)點(diǎn) //并且設(shè)置顏色 $(".div:has(span)").css("color", "blue"); </script> <h3>:parent/:empty</h3> <div class="left"> <div class="aaron"> <a>:parent</a> </div> <div class="aaron"> <a>:parent</a> </div> <div class="aaron"> <a>:parent</a> </div> <div class="aaron"> <a></a> </div> </div> <script type="text/javascript"> //選擇所有包含子元素或者文本的a元素 //增加一個(gè)藍(lán)色的邊框 $("a:parent").css("border", "3px groove blue"); </script> <script type="text/javascript"> //找到a元素下面的所有空節(jié)點(diǎn)(沒(méi)有子元素) //增加一段文本與邊框 $("a:empty").text(":empty").css("border", "3px groove red"); </script> </body> </html>
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
使用Javascript實(shí)現(xiàn)選擇下拉菜單互移并排序
本文給大家介紹使用js實(shí)現(xiàn)下拉菜單可選擇互相移動(dòng)并實(shí)現(xiàn)菜單排序,代碼簡(jiǎn)單易懂,具有參考價(jià)值,需要的朋友參考下吧2016-02-02jquery實(shí)現(xiàn)checkbox全選全不選的簡(jiǎn)單實(shí)例
本篇文章主要是對(duì)jquery實(shí)現(xiàn)checkbox全選全不選的簡(jiǎn)單實(shí)例進(jìn)行了介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-12-12【經(jīng)典源碼收藏】jQuery實(shí)用代碼片段(篩選,搜索,樣式,清除默認(rèn)值,多選等)
這篇文章主要介紹了jQuery實(shí)用代碼片段,包括篩選,搜索,樣式,清除默認(rèn)值,多選等多種功能.具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06jQuery基本選擇器(實(shí)例及表單域value的獲取方法)
下面小編就為大家?guī)?lái)一篇jQuery基本選擇器(實(shí)例及表單域value的獲取方法)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05JQuery中關(guān)于jquery.js與jquery.min.js的比較探討
jquery-1.4.2.min.js是優(yōu)化的,而query-1.4.2.js是易于開(kāi)發(fā)著閱讀的,具體詳解祥看本文,希望對(duì)你有所幫助2013-05-05詳談 Jquery Ajax異步處理Json數(shù)據(jù).
啥叫異步,啥叫Ajax.咱不談啥XMLHTTPRequest.通俗講異步就是前臺(tái)頁(yè)面javascript能調(diào)用后臺(tái)方法.這樣就達(dá)到了無(wú)刷新.2011-09-09jQuery實(shí)現(xiàn)自動(dòng)輸入email、時(shí)間和域名的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)自動(dòng)輸入email、時(shí)間和域名的方法,涉及jQuery表單操作的相關(guān)技巧,需要的朋友可以參考下2016-08-08jQuery實(shí)現(xiàn)鼠標(biāo)經(jīng)過(guò)圖片變亮其他變暗效果
jQuery實(shí)現(xiàn)的仿商城圖片變亮變暗效果,鼠標(biāo)懸停圖片之后該圖片變亮,其他圖片變暗。移開(kāi)鼠標(biāo)所有圖片變亮,兼容主流瀏覽器,適用瀏覽器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗,有需要的小伙伴可以參考下。2015-05-05JQuery實(shí)現(xiàn)帶排序功能的權(quán)限選擇實(shí)例
這篇文章主要介紹了JQuery帶排序功能的權(quán)限選擇,涉及jQuery鼠標(biāo)事件及json數(shù)據(jù)處理的相關(guān)技巧,需要的朋友可以參考下2015-05-05使用jquery實(shí)現(xiàn)select添加實(shí)現(xiàn)后臺(tái)權(quán)限添加的效果
使用jquery實(shí)現(xiàn)select添加實(shí)現(xiàn)后臺(tái)權(quán)限添加的效果,需要的朋友可以參考下。2011-05-05