getElementById('hoge')をカウントして、文末に数字を挿入したい

Question

前提・実現したいこと

document.getElementById('hoge')の「hoge」の文末に数字を挿入したいのですが、どのように記述したらよいのかわからず質問失礼します。

<span id="hoge1"> aaa1 </span> <span id="hoge2"> aaa2 </span> <span id="hoge3"> aaa3 </span> . . . といった記述があり、それぞれ別のコピー範囲とさせたいです。 なので、js側のdocument.getElementById('hoge')の部分に、document.getElementById('hoge+(++count)')といったようにカウントを挿入したいのです。

ご教授いただけますと幸いです。

該当のソースコード

  function copy(){
    //範囲を指定
    let range = document.createRange();
    let span = document.getElementById('hoge');
    range.selectNodeContents(span);

    //指定した範囲を選択状態にする
    let selection = document.getSelection();
    selection.removeAllRanges();
    selection.addRange(range);

    //コピー
    document.execCommand('copy');
  }

試したこと

var count=0;
for (var i=0;i<tags.length;i++){
document.getElementById('hoge+(++count)')
}

という記述や

let span = document.getElementById('hoge${y+1}');

という記述を試したのですが、動作しませんでした。

Answer 1

document.getElementById('hoge+(++count)')

通常の文字列リテラルの中に変数は書けないので、文字列リテラルの外に書いてください。'hoge' + (++count)

let span = document.getElementById('hoge${y+1}');

通常の文字列リテラルの中に変数は書けないので、テンプレートリテラルにしてください:

let span = document.getElementById(`hoge${y+1}`);

↑では ' ではなく ` です。

Comments

[pkpk0120]

書き直したところ、カウントが動作するようになりました。記述ミスでおはずかしいです。ありがとうございます！