jQuery ??? ?? ???
jQuery ??? ??? ???? ??? ??? ?? DOM ??? ??? ?? ?? ?? ?? ??? ???? ?????.
<div>John Resign</div> <div>George Martin</div> <div>Malcom John Sinclair</div> <div>J.Ohn</div> <div></div> <p></p> <div><p>Has p</p></div>
1. ??? ??? ??? ——:contains(text)
???:
E:contains(text) //E是指DOM元素，:contains(text)包含的文本，text是指定查找的字符串
??:
??? ??? "text"? ???? ?? ??
?? ?:
??? ??
Instance :
<script type="text/javascript"> $(document).ready(function(){
$('div:contains(John)').css('background','#f36');
});</script>??:
??? "John"? ??? div ??? ??? ??
??:
?? HTML ??? ???? ? ?? div? ??? ? ? ????. it ???? "John"??? ???? ???? ????. ???? ?? "John"??? ???? ??? div? ???? ???? ??? ? ??? ? ?? div? ???? "#f36"? ?? ??? ? ? ????. , ?? ??? ? ? ???? ?? Firefox? Firebug ??? ?? HTML? ?? ??? ? ? ????.
2. ??? ??? ??? - :empty
??? :
E:empty //其中E為DOM元素，:empty是指DOM元素中不包含任何子元素或文本
??:
?? ??? ???? ?? ? ??? ?????
?? ?:
Collection elements
Instance:
<script type="text/javascript"> $(document).ready(function(){
$('div:empty').css('background','#f36');
});</script>Function:
?? ?? ?? ??? ??? div? ???( ???? ?? ?? ??), ? ???? ???? ?? div? ??? ??
??:
?? HTML? ?? ???? ?? ??? ??? ?? ???? ??? ??? ???? ?? . ?? ??? ??? ???? ?? ??? div ? p ??? ????. ?? ? ???? ?? ??? ??? ???? ???? ?? div? ???? ?????? ???? div?? "#f36"? ???? ?????. . HTML ?? ??:
3. ??? ??? ??? - :has(selector)
Selector:
E:has(selector) //其中E為有效果DOM元素標(biāo)簽，:has(selector)含有一個選擇器，selector用于篩選的選擇器
Description:
??? ??? ???? ??? ???? ?? ??
?? ?:
??? ??
????:
<script type="text/javascript"> $(document).ready(function(){
$('div:has(p)').css('background','#f36');
});</script>??:
?? ??? ??? div ??? ??? ?? P
??:
? ??? ??? ????. div ?? ?? P? ????? ? ?? ??? ???? div ??? ???? ???? "#f36"?? ?????. ??? HTML:
4. ??? ??? ??? - :parent
???:
E:parent //E為有效的DOM元素標(biāo)簽，:parent含有子元素或文本內(nèi)容
??:
?? ?? ?? ???? ??? ?? ?? ??
?? ?:
??? ??
????:
<script type="text/javascript"> $(document).ready(function(){
$('div:parent').css('background','#f36');
});</script>??:
?? ?? ??? ??? ???? ??? div? ??????. ?, div? ?? ??? ???? ???? ??? ???? ?????.
??:
? ???? ?? ??? ??? ???? ???? ?? div? p ??? ??? ????. ??? div? ????? ??? ?????. , ? ? ??? ???? ?? ??? ?? ???? ??? div? ???? "#f36"?? ???????. HTML?
