hasClass（）は文字列で始まります

Question

hasClass()を使用すると、指定された文字列で始まるクラスを検索できますか？
複数のクラスを調べて、文字列で始まるクラスが少なくとも1つ存在するかどうかを調べたいとします。

string: "old" 

これは可能なのですか、含まれているかワイルドカード検索もできますか？

Answer 1

セレクタは次のようになります。[class^=old]

したがって：

$('[class^=old]') 

構文：

• [attr^=vvv] =>すべての要素が属性attrを持って、その値がvvvで始まる]を選択します。

• [attr$=vvv] =>すべての要素が属性attrを選択し、値の末尾がvvvになります。

• [attr*=vvv] =>すべての要素が属性attrであることを選択し、その値にはvvvが含まれます。

IsないhasClass：

あなたのケースでは、is方法がよりhasClass適している：

if (element.is('[class^=old]')){ 


    } 

そしてない

if (element.hasClass('[class^=old]')){ 


    } 

jQueryプラグイン：

その後、

$.fn.hasClassStartsWith=function(prefix){ 
    return $(this).is(`[class^=${prefix}]`); 
}; 

：

if (element.hasClassStartsWith('old')){ 
    // do your staff 
} 

DEMO

Answer 2

基本的には2部チェックする必要があります。セレクタを実行すると、単語を含むクラスを見つけることができます。

"old"、 "cold"、 "bold"を見つけようとしています。あなたが使うことができない理由は、クラスが "古い"ことができ、古いものから始めることができないからです。

これを行うには、正規表現をループして一致させるよりも、クラスリストの先頭に単語が含まれているかどうかを確認してください。

var elems = $('[class*="old"]').filter(function() { 
 
    return $(this).attr("class").match(/(^|\s)old/); 
 
}).addClass("picked");

.picked { background-color: yellow; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="old">old</div> 
 
<div class="old-asdf">old-asdf</div> 
 
<div class="foo-old-asdf">foo-old-asdf</div> 
 
<div class="cold">cold</div> 
 
<div class="old foo">old foo</div> 
 
<div class="foo old">foo old</div> 
 
<div class="foo olddoo">foo olddoo</div> 
 
<div class="foo ald">foo ald</div>