jQueryでランダムに生成したIDでハマった時の対応

はじめに

なんとなく趣味でちょっとjQuery扱ってみたいなーと思ってハマった部分のメモ書きになります！
jsで同様の挙動になるかは試しておらず、特に調べもしていないので、既存でも記事があったらごめんなさいｗ

目標

• 背景divに対して Math.rondom() で生成した値を利用したidによる新規divを作成した上で、cssを追加する
  • divを勝手に作って、勝手に消えるような挙動を作りたいためにランダムにしたかった

ハマったコード

var hoge = "Hoge-"
var bg = $("#background")
var id = hoge + Math.random()
bg.append('<div id="' + id + '"></div>')

$("#" + id).css({
... //css記載
})

上記の場合、cssが適用されなかった

原因

• idに対して . が組み込まれていたせい
  • ですよね・・・そりゃ、なりますよね・・・

改善したコード

var hoge = "Hoge-"
var bg = $("#background")
var id = hoge + Math.floor( Math.random() * 1000 )
bg.append('<div id="' + id + '"></div>')

$("#" + id).css({
... //css記載
})

• ものにはよりますが、1000個ぐらいのdivであれば、まぁ、重なることがないかなと

結論

• 使用できる文字列ぐらい、リファレンス読むかどうにかすべきだったｗ
• idに対して . が組み込まれていた場合、取得できない
  • 根本的原因調査まではしていないので、とりあえず動くからOKってことで・・・