javascript - jquery コレクションの操作

Question

以下で作成された JQuery コレクションがあります。

var children = $('span[data-Parent="7"]');

次に、そのコレクション内の項目の css クラスを操作したいと思います。私はもう試した：

for (var i = 0; i < children.length; i++) {
    var $child = children[i];
    if ($child.hasClass("red")) {
        $child.addClass("green");           
    }

ただし、オブジェクトにメソッド hasClass がないことを示すエラーが発生します。コレクションの要素をドキュメント要素にして操作できるようにする適切な方法は何ですか?

Answer 1

DOM 要素を jQuery オブジェクトとしてラップする必要があります。jQuery を使用した要素の反復処理は、通常、提供されているeach関数を使用して行われます。

$('span[data-Parent="7"]').each(function(){
   if ($(this).hasClass('red')) {
      $(this).addClass('green');
   }
});

コード全体を次のように縮小できることに注意してください。

$('span[data-Parent="7"].red').addClass('green');

Answer 2

私は使用すると思います$.each：

$.each(children, function(i, child) {
    if ($(child).hasClass("red")) {
        $(child).addClass("green");
    }
});

Answer 3

それぞれの子を循環し、.eachループでチェックを実行するだけです。

var children = $('span[data-Parent="7"]');

children.each(function(index)
{
    var self = $(this);

    if (self.hasClass("red"))
    {
        self.addClass("green");
    }
});

Answer 4

コードを次のように変更します。

var $child = $(children[i]);
//the rest of the code