JavaScript/jQuery

【jQuery】hasClass is not a functionエラー

投稿日:

スポンサードリンク

jQueryでセレクタを使って取得してきたjQueryオブジェクトからその子要素をchildrenで複数取得してきておいて、each等で各子要素に対してhasClassでチェックして指定のクラスがあれば何かするといった処理を行おうとしましたが「hasClass is not a function」のエラーが出てしまい結局何もできずじまいでした。

例えばこんな感じです。

var parent = $("#parent");
var children = parent.children();
for (var i = 0; i < children.length; i++){
    var child = children[i];
    if (child.hasClass('hoge')){ //←エラー
        /*******省略*******/
    }
}

デバッグして調べてみると明らかにその子要素がjQueryオブジェクトでないのが原因のようなのですが、いまいち解決策がわからずもやもやしてたところ、どうやらその子要素を「$()」で囲ってやるとそれがjQueryオブジェクトになりうまくいくというのがわかりました。

例えばこんな感じです

var parent = $("#parent");
var children = parent.children();
for (var i = 0; i < children.length; i++){
    var child = $(children[i]); //←$()で囲ってやる
    if (child.hasClass('hoge')){
        /*******省略*******/
    }
}

もしくは、配列のように添え字で取りだそうとするのではなくeachを使って$(this)で取りだすというのもあります。(結局は同じことですが)

var parent = $("#parent");
var children = parent.children();
var i=0;
children.each(function(){
    var child = $(this);
    if (child.hasClass('hoge')){
        /*******省略*******/
    }
    i++;
});
スポンサードリンク

-JavaScript/jQuery

Copyright© めめんと , 2019 All Rights Reserved Powered by AFFINGER5.