ホームページ >ウェブフロントエンド >jsチュートリアル >jQueryオブジェクトを拡張する際にメンバー変数を展開する方法とit_jqueryの実装方法

jQueryオブジェクトを拡張する際にメンバー変数を展開する方法とit_jqueryの実装方法

WBOY
WBOYオリジナル
2016-05-16 16:51:061095ブラウズ

まずコードの一部を見てみましょう:

コードをコピーします コードは次のとおりです:

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


このコードはメンバー myOwnMember を拡張しますjQuery オブジェクトに 2 つの関数 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.getMyOwnMember; // 3
body.setMyOwnMember(4); //4
body.getMyOwnMember(); //4


これは $("body") のみであるため、これは一度作成されると、その後の参照はすべて body 変数を通じて行われます。ただし、この方法では、グローバル スコープで body 変数を参照することができないため、依然として $("body") を使用して dom ノードを取得しています。 jQuery オブジェクト拡張変数の値はどうすれば保存できますか?解決策は、変数を jQuery オブジェクトではなく dom ノードに保存することです。dom ノード上に作成された jQuery オブジェクトの数に関係なく、それらはすべて同じ dom ノードを指します。したがって、コードを次のように変更します。



コードをコピーします getMyOwnMember: function () { return this[0].myOwnMember; },
setMyOwnMember: function (v) { this[0].myOwnMember = v; return this[0].myOwnMember; }
}
);

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

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。