javascript - 要素の内部HTMLコンテンツに基づくjQuery条件付き

Question

要素の内部HTMLが0の場合、javascript/jQueryを使用して要素のクラスを変更したい

以下のコードを試しましたが、うまくいかなかったようです。

var myElement = jQuery('.thisclass');
for(var i=0; i<myElement.length; i++){
    if(myElement[i].innerHTML == ' 0 '){
         jQuery('.thisclass').toggleClass('.newclass');
    }
}

誰かが私を案内してくれますか？私はここで何が間違っているのですか？それを行うためのより簡単な方法はありますか（すべてjQueryを使用）

jsfiddle- http: //jsfiddle.net/rm5Sp/

score 3 · Accepted Answer

これでうまくいくはずです：

$(".thisclass").each(function() {
    if($(this).html() == "0") {
        $(this).removeClass("thisclass");
        $(this).addClass("thatclass");
    }
});

score 1 · Accepted Answer

おそらく、ゼロの周りのスペースを削除すると役立つでしょうか？

myElement[i].innerHTML == '0'

また、代わりにこのコードを試して、アラートボックスが期待どおりかどうかを確認してください。

var myElement = jQuery('.thisclass');
for(var i=0; i<myElement.length; i++){
    alert( myElement[i].innerHTML );
    if(myElement[i].innerHTML == ' 0 '){
         alert( "Toggling" );
         jQuery('.thisclass').toggleClass('.newclass');
         alert( "Toggled" );
    }
}

最初のボックスには、innerHTMLが何であるかが表示されます。2つ目は、条件が機能していることを示します。そして3つ目は、jQueryが機能したかどうかを示します。

score 0 · Accepted Answer

おそらく問題は、toggleClass引数に余分なドットがあることです。それはただのはずですtoggleClass("newclass")。

もう1つの考えられるバグは（コードが何かを実行するのを妨げることはありませんが）、要素の1つでもコンテンツが含まれている場合、すべての.thisclass要素でクラスを切り替えていることです。それが意図的なものかどうかはわかりませんので、それを取り上げてください。0

最後に、次のような短い形式で同じコードを書くことができます。

// If you want to toggle class on an element-by-element basis
jQuery('.thisclass').filter(function() { return this.innerHTML == " 0 "; })
                    .toggleClass('.newclass');

// Or if you want to toggle on *all* elements if one matches:
var count = jQuery('.thisclass')
                .filter(function() { return this.innerHTML == " 0 "; })
                .length;
if(count) {
    jQuery('.thisclass').toggleClass('.newclass');
}

score 0 · Accepted Answer

空の不要な末尾のスペースを削除するには、内部のhtmlコンテンツをトリミングする必要があると思います。

これを試して：

$(".thisclass").each(function() {
    var thisHtml = $(this).html();
    if (thisHtml.trim() == "0") {
        $(".thisclass").toggleClass("newclass");
    }        
});

例を使用したjsFiddleへのリンク

score 0 · Accepted Answer

この行は問題です：

jQuery('.thisclass').toggleClass('.newclass');

ここで現在の要素を使用する必要があります。また、addClass / removeClass / tokenClassを実行する場合、クラス名にドット（ "。"）を使用する必要はありません。このようなものになります。

myElement[i].toggleClass('newclass');

score -1 · Accepted Answer

これを試して：

$(".thisClass").each(function(){
    if ($(this).html() == " 0 ") {
        $(this).toggleClass("newClass");
    }
});

javascript - 要素の内部HTMLコンテンツに基づくjQuery条件付き

6 に答える 6

Related

Reference