あなた
jQueryで特定のクラスを持った複数要素を取得して、その要素ごとのidを抽出したいです。
どうしたらいいですか？
今回はこんな疑問に答えていきます。
特定のクラスを持った複数要素を取得して、その要素ごとのidを抽出する方法
今回は、以下のようなHTML要素を想定します。
<div class="row">
<span class="message-ok" id="message-id-1">メッセージ1</span>
<span class="message-ok" id="message-id-2">メッセージ2</span>
</div>
上記から、「message-ok」というクラスを持った要素を取得しつつ、idの値を取得していきます。
セレクタとeachを使いましょう
結論から話すと、セレクタとeachを使えばOKです。
コードは次のとおりです。
$( ".message-ok" ).each( function (){
console.log($( this ).attr( "id" ));
} );
取り出した要素を配列化したいなら、以下のようにしましょう。
idの数値だけ取り出してみました。
let idArr = [];
$( ".message-ok" ).each( function ()
{
idArr.push( $( this ).attr( "id" ).substr( 11 ) );//メッセージのidを取得。11は「message-id-」の文字数。
} );
目印を付けた要素のデータを操作するのに便利です
設計上、classで目印的な意味を持たせることは結構あります。
そしてidに、固有の値（idなど）をもたせることも多いです。
そうなると「特定の目印を持ったグループから固有値を取り出して操作したい」というケースも割とあります。
その場合に、先程のコードは役に立つと思います。
今回は以上です。
ありがとうございました。
