特定のクラスを個別に配列にプッシュする方法はありますか？

Question

<div class="divColorContainer"> 
    <div class="Blue"></div> 
    <div class="Green"></div> 
    <div class="Blue"></div> 
</div> 

私はボタンをクリックすると、その属性を配列にプッシュして後でスコア関数を比較したいと思います。

element.push($(.divColorContainer).attr(.Blue)と他の多くのフェッチを試みました。

ボタンを1回クリックした後、最初のBlueクラスを選択/プッシュするにはどうすればいいのですか？もう一度クリックすると、次のBlueクラスを取得しますか？

なぜさまようとしている場合。それはメモリゲームのためです。あなたが:eq()やnth-child()を使用して、またはjqueryの.eq()

を使用して、そのインデックスで要素を決定するために$('.divColorContainer .Blue:eq('+Index+')')を使用することができますし、私はあなたが話しているattribute分からない..しかし、あなたはこのようなものを使用することができるセレクタについて

Answer 1

$(document).ready(function(){ 
 
    var Index = 0; 
 
    $('.selectBlue').on('click',function(){ 
 
    // you can here make whatever you want 
 
    // for example addClass(); 
 
    $('.divColorContainer .Blue:eq('+Index+')').addClass('bg'); 
 
    Index++; 
 
    }); 
 
});

.bg{ 
 
    background : blue; 
 
    color: #fff; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="divColorContainer"> 
 
    <div class="Blue">Blue</div> 
 
    <div class="Green">Green</div> 
 
    <div class="Blue">Blue</div> 
 
</div> 
 
<button type="button" class="selectBlue">Select Blue Class</button>

Answer 2

CSSクラス属性の使用を操作するためにjQueryメソッド。他の属性を操作する場合は、attr()とprop()のメソッドを使用してください。
ローカル変数とIf... Else Ifステートメントを使用して、クリック数を検討します。

Answer 3

これは私の最初のスタックオーバーフローの答えです。あなたがしようとしていることについては完全にはっきりしていませんが、私が助けてくれることを願っています。

メモリゲームの場合は、クラス名だけでなく、どの要素がクリックされたかは、再利用されているので、追跡しておくとよいでしょう。あなたが各要素に繰り返しクラスを追加することができ、各項目のインデックスをクリック取得するには

var classArray = []; 
$('.divColorContainer').children('div').each(function(){ 
    classArray.push($(this).attr('class')); // To save the class names 
}): 

：

にかかわらず、配列にクリックされた要素のクラス名を格納することは、あなたはおそらくのようなものを使用することができます。

例：

<div class="color Blue">Blue</div> 

それとも、それらをターゲット：

$('divColorContainer').children('div').on('click', function({})); 

そして、クリックされた要素のインデックスを取得するために、そのクラスにクリックイベントを設定する（0から始まるインデックスその内親）。あなたは次のようなものを使うことができます：

var colorArray = []; 
$('.color').on('click', function(){ 
    colorArray.push($(this).index()); 
});