1. ホーム
  2. jquery

[解決済み] 個々のクラス名で 'starts with' セレクタを使用する

2022-04-22 04:21:25

質問

以下のような場合。

<div class="apple-monkey"></div>
<div class="apple-horse"></div>
<div class="cow-apple-brick"></div>

次のセレクタを使って、最初の2つのDIVを見つけることができる。

$("div[class^='apple-']")

ところが、こんなのがあったら。

<div class="some-other-class apple-monkey"></div>
<div class="apple-horse"></div>
<div class="cow-apple-brick"></div>

最初の div のクラスは文字列として返され、実際には 'apple-' ではなく 'some-' で始まるので、これは 2 番目の DIV しか見つけられません (だと思います)。

これを回避する一つの方法は、starts withを使わず、containsにすることです。

$("div[class*='apple-']")

この場合の問題は、私の例では3番目のDIVも選択されることです。

質問です。jQueryで、class属性全体を文字列としてではなく、個々のクラス名に対して述語セレクタを使用するには、どのような方法が適切でしょうか?CLASSを取得し、それを配列に分割し、正規表現で個々のものをループさせるだけでよいのでしょうか?それとも、もっとエレガントで冗長でないソリューションがあるのでしょうか?

どのように解決するのですか?

apple-"で始まるクラスと、"apple-"を含むクラス。

$("div[class^='apple-'],div[class*=' apple-']")