JQuery $()用法總結

這次帶給大家JQuery $()用法總結，使用JQuery $()的注意事項有哪些，下面就是實戰案例，一起來看一下。

JQuery $()的用法：主要有三種，取表達式、取元素、取函數。

1、標籤選擇器$('p')、類別選擇器$('.myClass')、id選擇器 $('#myId')相對簡單，不多說。不過有一點－$('p>ul')和$('p ul')是有差別的， 

$('p>ul')是

的直接後代裡找

；而$('p ul')是在

的所有後代裡找

。
所以，$('#sId>li')所選擇的是id為"sId"的所有
• 孩子節點，即使這個
• 的後代還有
• 也不是它所找的範圍（所找到的DOM對象，只是它本級的DOM對象。）。而$('#sId li:not(.horizo​​ntal)')，就是指類別名稱"sId"裡面的所有li的子孫中沒有horizo​​ntal類別的所有元素。 ——這裡的not()是一個negation pseudo class. 

  這裡回傳的是一個jQurey對象，一個陣列對象，這個jQuery物件的長度可用.length()得到。

  2、XPath選擇器 
  如：選擇所有帶有title 屬性的鏈接，我們會這樣寫：$('a[@title]') 
  []裡帶@，說明[ ]裡的是元素的屬性；是個屬性選擇器 
  []裡沒@，說明[]裡的是元素的子孫。 
  $('ul li')和$('ul[li]')雖然回傳的都是一個jQuery數組，但兩者的意思正好相反。前者是要找

  下所有
  • 子孫，而後者卻是在找所有子孫為
  • 的
    陣列。
    在XPath中，要找一個「以...開頭」的屬性，用^=，如找一個name屬性是以mail開頭的input元素，就用 
    $('input[@name^ ="mail"]') 
    要找一個「以...結尾」的屬性，要用$= 
    要找一個「不頭」的屬性，用*= 
    3、不屬於上述的CSS和XPath的選擇器，就是自訂的選擇器了，用「:」表示，這裡要用的就是:first，:last，:parent ，:hidden，:visible，:odd，:even ，:not('xxx')， ":eq(0)"（始於0)，:nth(n），:gt(0)，:lt(0)，:contains("xxx") 
    如：$('tr:not([th]):even')意為元素的子孫中不含的所有子孫的偶數項 
    4、還有幾個，簡單不解釋了 
    

    $('th').parent()—— 
    $(&#39;td:contains("Henry")&#39;).prev()——内容包含有"Henry"的<td>的上一个节点 
    $(&#39;td:contains("Henry")&#39;).next()——内容包含有"Henry"的<td>的下一个节点 
    $(&#39;td:contains("Henry")&#39;).siblings()——内容包含有"Henry"的<td>的所有兄弟节点

    登入後複製

    還有一個，就是end()，這個方法肯定是用在某個DOM節點執行了某一動作之後，還想在與其相關的節點上執行類似動作，這裡就要用到end()。用過end()方法之後，所回傳的是執行動作的那個節點的父節點上。舉例 
    $(...).parent().find(...).addClass().end() 
    這裡執行動作的節點是find(...)，就是陣列對象，它所做的動作是“addClass()”，之後，用了個end()，這時所返回的東東就是指向了parent()所指向的節點，也就是執行“addClass()”動作的那個數組物件的父節點。 
    5、要直接存取DOM元素，可用get(0)的方法，如 
    $('#myelement').get(0)，也可縮寫成$('#myelement')[0]            
    

    相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

    推薦閱讀：

    怎麼操作頁面、視覺區、螢幕等寬高屬性
    

    怎麼使用Web Storage存儲
    

    以上是JQuery $()用法總結的詳細內容。更多資訊請關注PHP中文網其他相關文章！