要素中の要素のクラスが全て同じだったときに実行するjquery：アーカイブ：ドラクエ10冒険・サイト運営ブログ

2019/05/30 00:05:19

要素中の要素のクラスが全て同じだったときに実行するjquery

こんなスクリプト(jquery)を書いてみました。
　

こんなようなhtmlで

nothingの入れ子の要素のクラスが全て同じ(あああ)だったとき、
.nothingの中を”なし”にするスクリプトです。
　
このサイトで言うと、宝珠を何も落とさないモンスターの時に使おうかと思ってました。
細かく書きますと「.あああ」をcssで「display:none;」にし、
宝珠データをDBから取ってきて「.あああ」の中に「復讐のテンション」があるときは
クラス名も「.あああ復讐のテンション」に変更して
display:none;を回避させてるわけです。

昔はDBに、ここは空白ですよという文字(クラス名)を入れていたんですが、
容量の無駄でしょうということでこの形になったわけです。
・・・なんのはなしでしたっけ
　
スクリプト的には少しひねってまして、
単純に文字を比較するのではなく、アレイに子のクラス名を収納して、
重複を束ねて、
そのアレイ中の数が一つだったときに発火するようにしています。
おそらくループ+ifでやるよりも処理が早いと思いますが、
・・・どうなんでしょうね

スクリプト自体はこれでいけてると思うんですけど
何かしらの例外(同じ宝珠を記載していたとか)でいけてなく、
宝珠があるのに”なし”になったら困るのでボツりました。
それなら数ではなく、重複を束ねた後の文字で比較すれば良いような気もします。
ただcssだけでシンプルに作れそうだったのもありボツはボツなんです。
　
　
ええ、ぼつネタですが？