javascript - Jqueryセレクターの後の[]括弧はどういう意味ですか?

Question

このコードを使用して、プリロードされた mp3 ファイルを再生しています。

var shuffle = $("#shuffle")[0]; 

shuffle.play();

シャッフルは私のIDです。ネットからコードを取得しましたが、jqueryセレクターの後の[0]が何をするのかわかりません。外すと音が出ません。

ありがとう

Answer 1

jQuery は、一致したすべての要素を含む配列のようなオブジェクトです。多くの場合、jQuery はデフォルトでその変更をコレクションの最初の要素に適用します。

$("li").css("display"); // display val of first element, not all elements.

多くのli要素が見つかった可能性がありますが、jQuery オブジェクトは暗黙のうちに最初の要素について教えてくれます。$.getメソッドを使用して、明示的にそうするように指示できます。

$("li").get(0); // Returns first DOM element
$("li")[0]; // Also returns first DOM element

をチェックして、nodeNameこれを確認できます。

$("li").get(0).nodeName; // LI
$("li")[0].nodeName; // LI

カバーの下を見ると、どのよう$.get()に実装されているかがわかります。

get: function(num) {
  return num == null 
    ? this.toArray() 
    : ( num < 0 
          ? this[ this.length + num ] 
          : this[ num ] );
}

このことから、引数が指定されていない場合、要素のコレクション全体が配列に変換されてから返されることがわかります。たとえば のように引数が指定されている場合2、要素をインデックス 2 として返します-2。インデックス。

だからあなたの特定の例に関して：

var shuffle = $("#shuffle")[0];
shuffle.play();

jQuery は、 の id 値を持つ要素を取得するために使用されますshuffle。これは、jQuery 配列のようなオブジェクトを返します。ただし、play()メソッドは jQuery オブジェクトには存在せず、オブジェクトに存在し#shuffleます。そのため、コレクションの最初の要素を取得する必要があります。

を使用することもできますが$.get(0)、先ほど見たように、これはもう 1 つのステップを追加するだけです。内部的には、jQuery は上記で実行したのと同じコードを実行します[0]。

Answer 2

あなたの質問の直接の文脈で$("#shuffle")は、オブジェクトを返すidのセレクターですjQuery（配列自体ではなく、配列のような構造を持っています）、その[0]部分は実際に要素のネイティブDOMElementオブジェクトを返しています呼び出しによって返されるオブジェクトshuffleの代わりにidを使用します( なし)。jQuery$('#shuffle')[]

やってることと本質的には同じdocument.getElementById('shuffle')

編集（マットが指摘したように）

これにより.play()、音声ストリームを開始するための呼び出しを行うことができます。

Answer 3

$('#shuffle') の後の括弧は、提供されたそのセレクターの最初の要素を取得します。

$('div.test')[0];

<div class="test"></div> <-- this one would get returned
<div class="test"></div>
<div class="test"></div>

Answer 4

一致した要素セットの最初の要素を含むネイティブ JavaScript オブジェクトを返します。

Answer 5

その意味は、配列[0]、[1]、[2]で常に使用される処理対象のオブジェクトの時系列順序です...ここで確認できます

Answer 6

返された配列の n 番目の要素。通常の javascript や php と同じで、配列をサポートするプログラミング言語のかなりの部分です。

Answer 7

JQuery は配列を返します。[0] は配列の最初の項目を取ります。