2011-08-24 15 views
58

私はnoConflictモードでjQuery v1.6.1を使用しています。jQuery IDセレクタ( "#id")は配列を返します

私は$j("#divID").valueなどのIDセレクタを使用して、格納された項目の値を取得しています。

残念ながら、$j("#inputID")はアイテムのリストを返していますので、オブジェクトの値を取得するには$j("divID")[0].valueを使用する必要があります。定義上、任意のidを持つhtml要素は1つのみであるため、[0]は不要です。

IDedオブジェクトから値を取得する適切な方法ですか?それとも良い方法がありますか?

ありがとうございます!

+0

()'? – user113716

+1

'#divID'が本当に' div'を参照する場合、 'value'や' .val() 'は動作しません。フォーム要素には 'value'プロパティしかありません。 –

+0

良い点、@Felix。私はその問題を修正した。 – Richard

答えて

93

$j("#divID").val()はうまく動作します。

jQuery documentationあたり、.val()は、一致する要素のセットの最初の要素の値を返します。

jQueryがなぜこのように動作するのかを概念的に理解することは価値のあることです。セレクタクエリの結果はjQueryオブジェクトです。 jQueryが提供する無数のメソッドを含むjQueryオブジェクトです。 .val().fadeIn(),.hide()などのメソッドの1つです。これらのメソッドはDOMオブジェクトのメソッドではなく、jQueryオブジェクトのメソッドです。 jQueryオブジェクトは一般目的であり、内部配列に0,1つ以上のDOMオブジェクトを保持できるため、結果に0,1またはそれ以上のDOMオブジェクトがあるかどうかにかかわらず、jQueryセレクタ呼び出しから同じjQueryオブジェクトが返されます。

したがって、1つのオブジェクトのみを含む$j("#divID")は、何百ものDOMオブジェクトを含むかもしれない$j(".rows")と同じタイプのオブジェクトを返します。これは、セレクタクエリから返されるオブジェクトの数に応じて異なる処理を行う必要がないため、jQueryプログラミングを大幅に簡素化します。

$j("divID")[0]を参照すると、jQueryオブジェクトの内部配列(セレクタクエリに設定されています)に到達し、その配列の最初のDOMオブジェクトが取得されます。その時点では、jQueryオブジェクトではなく通常のDOMオブジェクトがあり、通常のDOMメソッドや属性を使用できます。場合によっては(実際のDOMオブジェクトを取得するために)必要ですが、通常jQueryがjQueryオブジェクトで提供するメソッドを使用する方が簡単です。ほとんどのメソッドに複数のリクエストをチェーンすることができ、自動的に内部配列のすべてのDOMオブジェクトを繰り返し処理するなど、多くの利点があります。

たとえば、これは$j("rows-even").hide()と呼ばれ、そのクラスには20行あり、すべてがhide()メソッドで操作され、それ以上のコードはありません。あなたは、次のように複数のメソッドを連鎖させることができます:$j("rows-even").slideUp().slideDown()。この場合、アニメーションを実行していて、jQueryはこれら2つのアニメーションを連動させ、最初のアニメーションが終了すると自動的に2つ目のアニメーションを開始します。これは、多くの状況で非常に有用であり、プレーンJSを使用して通常書かれなければならないものに対して、大量のコードを節約することができます。

+0

驚くばかりの答え、ありがとう! – Richard

+0

+1良い、完全な答え。 –

+0

+1良い答え。 – Usman

3

$j("#divID")は、jQueryオブジェクトを返します。選択した要素の値を取得するには、値を取得するためにそのメソッドvalを呼び出す必要があります。

使用あなたは.val `以外の意味$j("#divID").val();

関連する問題