要約

つまり、要素セットの active クラスを追加および削除する、よりエレガントな方法を探しているようですね。すべての要素から active クラスを削除して、現在アクティブな要素に追加し直すのではなく (これにより、潜在的な問題や視覚的な不具合が発生する可能性があります )。また、active クラスを削除/追加する必要があるかどうか (アクティブな要素が変更されていない場合は ) を確認するために、あまりにも多くのコードを追加するのを避けようとしているようです。

考えられる解決策

個人的には、これが最良のアプローチであるとは思いません (コードの実行に三項演算子を使用すると混乱する可能性があります)が、コードは十分にシンプルで全体的に非常に読みやすいと思います。

基本的に、コードをマージして、active クラスを追加または削除できます。 add() 関数は、要素にそのクラスが現在存在しない場合にのみクラスを追加しますが、remove() 関数はその逆を行います (クラスが存在する場合のみ削除します)。 。これは、アクティブな要素が変更されない場合、視覚的な不具合を心配することなく、アクティブな要素に対して add() 関数を呼び出すことができることを意味します。

このロジックを使用すると、すべての 可能な 要素をループするだけで済み、三項 演算子を使用して、要素が現在アクティブな要素であるかどうかを確認できます。その場合は、add() を呼び出します (アクティブな要素が変更されていない場合、これは効果がありません)。それ以外の場合は、remove() を呼び出します。