画像グループから2次元配列を取り込む

Question

私はいくつかの画像を持っています。それらをグループ化してタイトルで選択し、それらを個別に操作できる必要があります。その上

<img src="1.jpg" title="cat"> 
<img src="2.jpg" title="cat"> 
<img src="3.jpg" title="cat"> 
<img src="1.jpg" title="dog"> 
<img src="2.jpg" title="dog"> 
<img src="3.jpg" title="dog"> 
<img src="1.jpg" title="horse"> 
<img src="2.jpg" title="horse"> 
<img src="3.jpg" title="horse"> 

...と：

私のイメージはこのように見えます。

私はこのようになり、アレイ作成しようとしています：

imgArray = [cat[1,2,3], dog[1,2,3], horse[1,2,3]]; 

...配列の最初のレベルはグループ（タイトル）であり、各グループ内では、実際の要素の配列であります一致するタイトルで。これまでのところ、私はこれやってる

var imgGroup = imgArray[cat]; 
doThings(imgGroup) 
function doThings(target){ 
    var pri = target[0], sec = target[1], ter = target[2]; 
    pri.doThis(); sec.doThat(); ter.doTheotherthing(); 
}); 

：私はこのようなものを行うことができるようにする必要があり

img.each(function(){ 
    var self = $(this), title = self.attr('title'); 
    imgArray.push([title, self]) 
    imgArray = $.unique(imgArray) //remove duplicate titles 
}); 

をしかし、これは明らかに私は愚かに見える理由はおそらく働いていません。/

誰でもこのロジックで私を助けることができますか？

Answer 1

私はあなたが本当に必要な構造は、あなたが動物の種類ごとにプロパティを持つオブジェクト（ない配列）である疑いがあり、各プロパティの値は、数字の配列である：次に

var imgObj = { 
    "cat" : [1, 2, 3], 
    "dog" : [1, 2, 3], 
    "horse" : [1, 2, 3] 
} 

あなたが言うことができます。

imgObj["cat"]   // give the array [1,2,3] 
imgObj["horse"].length // gives 3 
imgObj["dog"][0]  // accesses the first value in the dog array 

あなたのコードは、あなたの配列/を作成して使用しようとしている方法は、あなたがサブアレイは、jQueryの自体は、個々のDOMのimg要素を含んでいることをオブジェクトを保持したいと思われるオブジェクトことを除いて？それでも、プロパティが配列であるオブジェクトが必要です。 jQueryのは、既存のコードからけれども、あなたがそれを使用しているように見えるよう

あなたはので、ここで、あなたのマークアップから上記カルコゲノフルバレン骨格を作成することができます方法です、あなたの質問にタグを付けていなかった。

var imgObj = {}; 
$("img").each(function() { 
    var title = this.title; 
    if (!imgObj.hasOwnProperty(title)) 
     imgObj[title] = []; 

    imgObj[title].push($(this)); 
}); 

あなたは、その後でなければなりません

doThings(imgObj["cat"]); // passes just the cat array 

Answer 2

タイトルの代わりにクラス名を使用しないのはなぜですか？次に、getELementsdByClassNameまたはクラスごとに画像をフィルタリングするクエリを使用して、グループ内のすべての '馬'要素を処理できます。ユニークな情報のタイトルを使用してください...