擴展jQuery對象時，如何擴展成員變量

先看一段代碼：

jQuery.fn.extend(
{
    myOwnMember: 3,
    getMyOwnMember: function () { return this.myOwnMember; },
    setMyOwnMember: function (v) { this.myOwnMember = v; return this.myOwnMember; }
}
);


$("body").myOwnMember; //3
$("body").getMyOwnMember(); //3
$("body").setMyOwnMember(4); //4
$("body").getMyOwnMember(); //3

這段代碼給jQuery對象擴展了一個成員myOwnMember，兩個函數getMyOwnMember，setMyOwnMember分別用於返回和設置myOwnMember的值。但是我們看到setMyOwnMember並沒有起作用，我們再次getMyOwnMember時，返回的還是初始的值。這是爲什麼呢？原因在於$("body")每次都會創建一個新對象，所以每次$("body")裏面的myOwnMember都是初始值。如果我們將代碼改成：

jQuery.fn.extend(
{
    myOwnMember: 3,
    getMyOwnMember: function () { return this.myOwnMember; },
    setMyOwnMember: function (v) { this.myOwnMember = v; return this.myOwnMember; }
}
);


var body = $("body");
body.myOwnMember; //3
body.getMyOwnMember(); //3
body.setMyOwnMember(4); //4
body.getMyOwnMember(); //4

這就是我們想要的效果了，這是因爲$("body")只創建了一次，後面都是通過body變量進行的引用。但是這種方法在實際使用過程中還是存在問題，因爲我不可能在全局範圍內都能夠引用到body變量，很多時候還是通過$("body")來獲取dom節點，這樣的話我們又怎麼保存一個jQuery對象擴展變量的值呢？解決方法是我們不要把變量保存在jQuery對象上，而是保存在dom節點上，無論在一個dom節點上創建多少個jQuery對象，都是指向同一個dom節點的。所以我們將代碼改成如下：

jQuery.fn.extend(
{
    getMyOwnMember: function () { return this[0].myOwnMember; },
    setMyOwnMember: function (v) { this[0].myOwnMember = v; return this[0].myOwnMember; }
}
);


$("body").getMyOwnMember(); //undefined
$("body").setMyOwnMember(4); //4
$("body").getMyOwnMember(); //4