要素を配列に配置しますか？

Question

私は質問があります。最初にHTMLを投稿します。デザイン用にテーブルを使用すべきではないと思います。しかし、学習目的のためだけです。

<table id="placeholder"> 
<tr> 
    <td><img src="img/1.jpg"/></td> 
    <td><img src="img/2.jpg"/></td> 
    <td><img src="img/3.jpg"/></td> 
</tr> 
<tr> 
    <td><img src="img/4.jpg"/></td> 
    <td><img src="img/5.jpg"/></td> 
    <td><img src="img/6.jpg"/></td> 
</tr> 
<tr> 
    <td><img src="img/7.jpg"/></td> 
    <td><img src="img/8.jpg"/></td> 
    <td><img src="img/9.jpg"/></td> 
</tr> 
<tr> 
    <td><img src="img/10.jpg"/></td> 
    <td><img src="img/11.jpg"/></td> 
    <td><img src="img/12.jpg"/></td> 
</tr> 
<tr> 
    <td><img src="img/10.jpg"/></td> 
    <td><img src="img/11.jpg"/></td> 
    <td><img src="img/12.jpg"/></td> 
</tr> 
</table> 

すべてのIMGを配列に入れることはできますか？
そのようにすれば、私は簡単にイメージを消すことができます。
私は5枚目の画像を取り除きたいと言っています。私はちょうど次のようなことをすることができます：
images[4].fadeOut("slow");
またはそういうものです。
これは可能ですか？それとももっと良い方法がありますか？
私はすでにvar images = $('td > img');を試しましたが、うまくいかなかった（または何か間違っています）。私はインターネットでもそれを行う方法を探していますが、私はまだ助けてくれるものは何も見つかりませんでした。うまくいけばいい？
ありがとうございます！

Answer 1

あなたは今、特定の画像を選択したい場合は、あなたが.eq()^[docs]を使用することができます

var $images = $('#placeholder img'); 

ですべての画像を選択することができます。

$images.eq(4).fadeOut(); 

$images[4]はあまりにも動作しますが、それはない復帰を行いますjQueryオブジェクトですが、対応するDOM要素です。したがって、fadeOutに直接電話することはできません。

のjQueryなし

---

、あなたがgetElementsByTagName^[docs]ですべての画像を得ることができます：

var images = document.getElementById('placeholder').getElementsByTagName('img'); 

これはあなたのDOM要素の配列（実際NodeList）を与えると、再びあなたが直接jQueryのメソッドfadeOut上を呼び出すことはできませんそれら。

Answer 2

コードは正常に機能するはずです。

あなたのJSは、おそらくあなたはjQueryのドキュメントレディ機能でそれを配置する必要がありますので、ページが読み込まれる前にロードされ

var imgs = $("#placeholder td > img"); 
console.log (imgs[0]); 

：

$(function() { 
    var imgs = $("#placeholder td > img"); 
    console.log (imgs[0]); 
}); 

Answer 3

あなたははこの操作を行うことができればそれは絶対に素晴らしいことだが、できません。 <td><img src=imagearray[5]><td>と言うことができますが、htmlとcssでは許可しません。 はですが、各クラスにクラスを与え、各クラスの画像をbackground-image:として保存し、それらの人をフェードします。

編集： oops、jqueryタグが表示されませんでした。

Answer 4

$('td > img')は配列ではなくjQueryオブジェクトを返します。だからあなたはそうそれを使用することができます：

$('td > img').each(function(index, imageElement) { 
    // Do logic based on the index or something else. 
});