3

私は次のHTMLを持っています:

<div class="cols someclass"></div> <!--like this cols1, cols2, etc..-->
<div class="columns someclass"></div> <!--like this columns1, columns2, etc...-->
<div class="col-1 someclass"></div> <!--like this col-2, col-3,etc...-->
<div class="column-1 someclass"></div> <!--like this column-2, column-3, etc...-->

で始まるすべてのクラスを削除するには"col"?

4

1 に答える 1

6

これにはjQueryの魔法はないと思うので、私の解決策は次のとおりです。

$('[class*=col]').each(function() {
    this.className = $.grep(this.className.split(' '), function(el) {
        return !/^col/.test(el);
    }).join(' ');
});

フィドル

基本的に、クラスにある要素を選択してcol反復処理し、クラスを反復処理して、で始まる要素を削除しますcol

または正規表現なし:

$('[class*=col]').each(function() {
    this.className = $.grep(this.className.split(' '), function(cl) {
        return cl.lastIndexOf('col', 0);
    }).join(' ');
});

フィドル

この回答の修正版を使用します。クラスが偽の値で始まる場合lastIndexOfに返されるため、それを削除します。クラスが で始まらない場合、真の値である が返されます。少し読みやすくするためにも使用できます。0colgrepcol-1return cl.lastIndexOf('col', 0) !== 0;

または正規表現のみを使用:

$('[class*=col]').each(function() {
    this.className = this.className.replace(/(^| )col[^ ]*/g, '');
});

フィドル

文字列の先頭またはスペースの後に一致colし、別のスペースまたは文字列の末尾までのすべての先頭文字と共にそれを削除します。


参照

  • jQuery.grep- フィルター関数を満たす配列の要素を検索します。元の配列は影響を受けません。
  • element.classNameclass-指定された要素の属性の値を取得および設定します。

もちろん、このセレクターは最適ではありません。要素に がfoocolある場合は$('[class*=col]')それを選択しますが、$.grep/regex は で始まらないため削除しませんcol。より良いセレクターは考えられません (スペースで区切られたリストの部分的な文字列で始まる値を選択する属性セレクターはありません) にもかかわらず、これで十分です。

于 2013-07-07T04:54:15.020 に答える