たまにありますよね、他社が作ったJSの改修案件。そんな案件でたまにあるのですが、HTMLに同じidがいくつもあったり、謎な記述があったり、ドックタイプが書かれていない時もありました。そういう時に限ってHTMLの修正は不可。
ということで今回はHTMLが変更できない中、同じidが複数書かれている時に使えるjQueryコードの紹介です。
念のため書かせてもらいますが、本来1つのidはページ内で1回のみ使えるものです。それなのに何回も使われているのは・・・
さて、それでは本題に戻ります。
正しく動かないjQueryコード
classと同じ感覚で書いた場合だと以下のように書きますが、この書き方だと最初の1つ目しか.show()がききません。
$('#sameId').show();
じゃあ、.each()なら行けるんじゃね、と思っても、
$('#sameId').each(function(){ $(this).show(); });
この書き方でも最初の1つ目しか.show()がききません。
正しく動くjQueryコード
同じ名前のid全てに処理をさせるには属性フィルタで書きます。
$('[id=sameId]').show();
タグとかが統一されている場合だと、要素名も書いた方がより限定的になりベターです。
$('div[id=sameId]').show();
これで同名のidを一気に操作できます。
ではでは、よき開発ライフを~。