JQuery常用方法

1）$("selector").map(callback(index,domElement));　　//.map()方法 用於將當前匹配元素集合中的每一個元素傳入回調函數（callback）中，並返回一個新的jQuery對象，也就相當於通過該方法重組匹配集合內容。其中index是元素索引，domElement是當前索引對應的jQuery對象。

 

2）$("selector").not(expr);　　//.not()方法 用於在匹配selector元素集合中移除指定的集合，expr可以為選擇器（selector）也可以是一個函數，若為選擇器則在selector集合中移除符合expr的集合；若expr為一個函數，則只有當當該函數返回true時才會移除當前索引對應的jQuery對象。

 

3）$("selector").add(selector1[,context]);　　//.add()方法 該方法是在匹配元素集合中添加selectior1元素，與not()方法的作用相反。其中selector1可以是一個jQuery對象、DOM對象以及HTML標簽。而可選參數context是指定要插入上下文的位置

 

4)$.each(object,callback(indexInArray,valueOfElement));　　//.each()方法  用於遍歷object數組或對象 ,其中callback是回調函數 注：該方法與$("selector").each(function(){})不同，$.each()方法可以遍歷所有的的數組，而$("selector").each(function(){});只能遍歷jQuery對象數組。

var array = [1,2,3,4];
 
$(array).each(function(index){
    alert(this);
});
 
$.each(array,function(index){
    alert(this);
});

 

5）$.contains(container,contained);　　//.contains()方法 用於檢測一個contained對象是否包含在container對象中，若包含返回true否則返回false。　

$.contains($("div")[],$("p")[0]);　　//檢測第一個p標簽是不是在第一個div標簽內。

 

6）$.isEmptyObject(object);　　//.isEmptyObject()方法 用於判定一個對象是否為空（不包含任何屬性的對象為空），若為空返回true　　

$.isEmptyObject({});　　//返回 true 
$.isEmptyObject({foo:"bar"});　　//返回false

 

7）$.extend(target,object1);　　//.extend()方法 將兩個或多個對象的內容合並到第一個對象target中，以實現第一個對象的擴展並返回被修改的對象。

　　

$.extend({foo:"aa"},{bar:"bb"});　　//結果為：{foo:"aa",bar:"bb"}

 

8）$.browser　　//.browser屬性 該屬性可以獲得當前瀏覽器的版本信息　

if($.browser.msie) alert("瀏覽器是IE："+$.browser.version);
if($.browser.mozilla) alert("瀏覽器是Firefox："+$.browser.version);

 

9）$.support　　//.support屬性  該屬性用於戰士不同瀏覽器各自特性和bug的集合

 

10).parent() 方法允許我們在 DOM 樹中搜索這些元素的父元素，沿 DOM 樹向上遍歷單一層級。

.parents() 方法允許我們在 DOM 樹中搜索這些元素的祖先元素，並用從最近的父元素向上的順序排列的匹配元素構造一個新的 jQuery 對象。元素是按照從最近的父元素向外的順序被返回的。

$(e.currentTarget).parent("ul")//查看父元素，滿足條件返回結果，不滿足返回為空
$(e.currentTarget).parents("ul")[0]//返回所有滿足條件的祖先元素，[0]表示獲取距離最近的一個結果

 

11)判斷數組元素位置

$(".js-groupStarResultList:visible").find(".flex-control-nav li a").index($(".flex-active"));

 

12） 在jQuery 1.4.2中，delegate和undelegate選項 

        //被引入代替live，因為它們提供了更好的上下文支持 
        //例如，就table來說，以前你會用 
    

 //.live() 
    $("table").each(function () {
        $("td", this).live("hover", function () {
            $(this).toggleClass("hover");
        });
    });
       //現在用 
    $("table").delegate("td", "hover", function () {
        $(this).toggleClass("hover");
    });

 

13）克隆一個元素

var cloned = $('#somediv').clone();

 

14）在jQuery中如何使用.siblings()來選擇同輩元素

 

// 不這樣做
    $('#nav li').click(function () {
        $('#nav li').removeClass('active');
        $(this).addClass('active');
    });
        //替代做法是

    $('#nav li').click(function () {
        $(this).addClass('active').siblings().removeClass('active');
    });

 

 

 

15）檢查圖像是否已經被完全加載進來

$('#theImage').attr('src', 'image.jpg').load(function () {
        alert('This Image Has Been Loaded');
      });