前端基礎JQuery

標籤：選擇   .class   nbsp   until   eva   基礎   jquery   篩選   outer   

JQuery對象是通過JQquery封裝DOM對象後產生的對象。JQuery對象是JQuery專屬的。如果一個對象是JQuery對象，那麼它就可以使用JQuery中的方法。

$("#test").html();    擷取ID為test的元素內的html代碼DOM實現代碼:document.getElementById("test").innerHTML;雖然JQuery對象是DOM對象封裝後產生的，但是JQuery無法使用DOM對象的任何方法，同理DOM對象也不能使用JQuery中的方法    約定如果擷取的是JQuery對象，那麼要在變數前加$var $variable=JQuery對象var variable=DOM對象$variable[0]:JQuery對象轉為DOM對象
$("#test")[0].innerHTML;

選取器

　　基本選取器

$("*") 通配$(#id") ID$(".class") 類$("element") 標籤$(".class,p,div") 多個元素

　　層級選取器

$(".outer div") .outer所有div後代$(".outer>div") .outer所有子代div$(".outer+div") .outer毗鄰div標籤$(".outer~div") .outer普通兄弟div標籤

　　基本選取器

$("li:first") li中的第一個元素$("li:eq(2)") li中索引為2的元素$("li:even") li中索引為偶數的元素$("li:gt(1)") li中索引大於1的元素$("li:lt(3)") li中索引小於2的元素$("li:odd") li中索引為奇數的元素

　　屬性選取器

$(‘[id="div1"]‘) id為div1的元素$(‘[xiaobai="handsome"][id]‘) xiaobai屬性為handsome且有id屬性的標籤

　　表單選取器

只適用於input標籤$(‘[type="text"]‘)=>$(":text")

篩選器

　　過濾選取器

$("li").eq(2)$("li").first()$("ul li").hasClass("test")

　　尋找篩選器

尋找子標籤： $("div").children(".test") 尋找div中所有類名為test的子項目                    $("div").find(".test") 尋找div中所有類名為test的後代標籤向下尋找兄弟標籤：$(".test").next() 類名為test的下一個兄弟元素                            $(".test").nextAll() 類名為test以後的所有兄弟元素                            $(".test").nextUntil() 類名為test以後的某條件之前的元素，不包含末元                                    素向上尋找兄弟標籤：$(".test").prev() 類名為test的之前的一個兄弟元素                            $(".test").prevAll()                            $(".test").prevUntil()尋找所有兄弟標籤：$(".test").siblings()尋找父標籤： $(".test").parent()                        $(".test").parents()                    $(".test").parentUntil()

 

前端基礎JQuery