jQueryオブジェクトとDOMオブジェクト間の変換実装
本稿では、jQueryオブジェクトとDOMオブジェクトを互いに変換する方法を紹介しますが、実は変換過程は非常に簡単なので、一緒に見てみましょう.
jQueryオブジェクトとDOMオブジェクトの相互交換を議論する前に,変数を定義するスタイルを約束する.取得したオブジェクトがjQueryオブジェクトの場合、変数の前に$を追加します.たとえば、次のようにします.
DOMオブジェクトを取得した場合は、次のように定義されます.
1.jQueryオブジェクトからDOMオブジェクトへ
jQueryオブジェクトはDOMのメソッドを使用できませんが、jQueryオブジェクトが提供するメソッドに慣れていない場合、またはjQueryが所望のメソッドをカプセル化していない場合、DOMオブジェクトを実用化せざるを得ない場合、以下の2つの処理方法があります.jQueryは、1つのjQueryオブジェクトをDOMオブジェクト、すなわち[index]とget(index)に変換する2つの方法を提供する.
(1)jQueryオブジェクトは配列オブジェクトであり,[index]の方法で対応するDOMオブジェクトを得ることができる.
jQueryコードは次のとおりです.
(2)他の方法はjQuery自身が提供し,get(index)法により対応するDOMオブジェクトを得る.
jQueryコードは次のとおりです.
2.DOMオブジェクトをjQueryオブジェクトに変換
1つのDOMオブジェクトについては、$()でDOMオブジェクトをパッケージするだけで、$(DOMオブジェクト)でjQueryオブジェクトを得ることができます.
jQueryコードは次のとおりです.
変換後、jQueryのメソッドを任意に使用できます.
以上の方法により、jQueryオブジェクトとDOMオブジェクトを任意に相互変換することができる.
最後に、DOMオブジェクトはDOMのメソッドを使用することができ、jQueryオブジェクトはDOMのメソッドを使用することはできませんが、jQueryオブジェクトはDOMを操作するためのより完全なツールを提供しています.
jQueryオブジェクトとDOMオブジェクトの相互交換を議論する前に,変数を定義するスタイルを約束する.取得したオブジェクトがjQueryオブジェクトの場合、変数の前に$を追加します.たとえば、次のようにします.
var $variable = jQuery ;
DOMオブジェクトを取得した場合は、次のように定義されます.
var variable = DOM ;
1.jQueryオブジェクトからDOMオブジェクトへ
jQueryオブジェクトはDOMのメソッドを使用できませんが、jQueryオブジェクトが提供するメソッドに慣れていない場合、またはjQueryが所望のメソッドをカプセル化していない場合、DOMオブジェクトを実用化せざるを得ない場合、以下の2つの処理方法があります.jQueryは、1つのjQueryオブジェクトをDOMオブジェクト、すなわち[index]とget(index)に変換する2つの方法を提供する.
(1)jQueryオブジェクトは配列オブジェクトであり,[index]の方法で対応するDOMオブジェクトを得ることができる.
jQueryコードは次のとおりです.
var $cr = $("#cr"); //jQuery
var cr = $cr[0] //DOM
alert(cr.checked) // checkbox
(2)他の方法はjQuery自身が提供し,get(index)法により対応するDOMオブジェクトを得る.
jQueryコードは次のとおりです.
var $cr = $("#cr");
var cr = $cr.get(0);
alert(cr.checked)
2.DOMオブジェクトをjQueryオブジェクトに変換
1つのDOMオブジェクトについては、$()でDOMオブジェクトをパッケージするだけで、$(DOMオブジェクト)でjQueryオブジェクトを得ることができます.
jQueryコードは次のとおりです.
var cr = document.getElementByID("cr"); //DOM
var $cr = $(cr);
変換後、jQueryのメソッドを任意に使用できます.
以上の方法により、jQueryオブジェクトとDOMオブジェクトを任意に相互変換することができる.
最後に、DOMオブジェクトはDOMのメソッドを使用することができ、jQueryオブジェクトはDOMのメソッドを使用することはできませんが、jQueryオブジェクトはDOMを操作するためのより完全なツールを提供しています.