youkantoe

JSでのターゲットの汎用性について

2020 / 4 / 10

仮にどっかしらにmoreボタンとかがあったとして、押すと何か表示されるとするじゃないですか。

そのターゲットに対して、

js-more-target js-more-target-company

というクラスをつけたとして、

js-more-target : ターゲットの汎用クラス

js-more-target-company : ターゲットの単一クラス

という仕組みで管理するとして、この単一クラスをどうやって or どこで識別するかが大切な気がする。

js-more-targetみたいな汎用クラスはjs側でパパッととってしまって良いと思うけども、

js-more-target-xxx系クラスは

  • 今後増えるかもしれない

    • つまり変更される可能性と、メンテナンスコストが高い
    • ということは、変更する場合に楽であることが望ましいとなる
    • 理想を言えば、誰でも変更できることがよいと思う

解決策

  • データ属性でターゲットとなるクラスやデータ属性を指定する
  • 相対的にDOMを取得(親とかそんな感じ)して持ってくる
  • 親ラッパーをデータ属性などで指定して、jqueryのfindとか、document.querySelectorとかで持ってくる。