🔖

hoge-01とかhoge-02とか必ず2桁の数値を返す関数

2022/12/22に公開約700字

クラスにhoge-01とかhoge-02のように2桁の数値を返す関数です

実際は以下のようにaria-controlsをid-01のように自動で連番にさせるために使用しました

  _initBtn() {
    const accoBtns = [...this.DOM.accoBtns]; //配列に変更
    const btnClass = this.ACCORDIONS_CLASS + "-btn";
    accoBtns.forEach((btn, i) => {
      const num = i + 1;
      btn.setAttribute("aria-controls", this.ACCO_ID + "-" + getTwoDigitsNumber(num));
      btn.classList.add(btnClass);
    });
    this.DOM.accoBtns = document.querySelectorAll("." + btnClass);
  }

2桁の数値を返す関数

'use strict'
const { log } = console;

/**
 * 2桁の数字を返す関数(3桁以上でも下2桁になる)
 * ex) getTwoDigitsNumber(7) //=> 07
 * @param {*} num 
 * @returns 
 */
export function getTwoDigitsNumber(num) {
  return ("0" + num).slice(-2)
}

slice(-2)は最後の2つの要素を取り出し、ここの数値を変えることで桁数も変えられます

Discussion

ログインするとコメントできます