JavaScript で文字列と変数を連結するにはどうすればよいですか?

文字列と変数の連結

JavaScript では、文字列と変数の連結は一般的なタスクです。 「文字列と渡された変数 (数値) から文字列を作成しようとしています。
どうすればいいですか?

• 演算子による連結:

  演算子を使用して文字列と変数を連結するだけです。例:

  const id = 42;
  const str = "horseThumb_" + id;

  ログイン後にコピー
  これにより、str は "horseThumb_42" と等しくなります。

• テンプレート リテラル (ES2015 ):

  ECMAScript 2015 で導入されたテンプレート リテラルを使用すると、バッククォート (`) を使用して文字列内に変数を埋め込むことができます。例:

  const id = 42;
  const str = `horseThumb_${id}`;

  ログイン後にコピー
  これにより、str は "horseThumb_42" と等しくなります。

• テンプレート リテラルを使用した要素の取得:

  文字列を要素 ID と連結する場合、テンプレート リテラルを使用して要素を直接取得できます。例:

  const id = 42;
  const element = document.getElementById(`horseThumb_${id}`);

  ログイン後にコピー
  これにより、ID「horseThumb_42」の要素が取得されます。

  コード例:

  提供された AddBorder 関数の使用質問では、演算子を使用した文字列の連結を示すことができます:

  function AddBorder(id) {
      const className = "hand positionLeft";
      document.getElementById("horseThumb_" + id).className = className;
  }

  ログイン後にコピー
  このコードは、className を ID「horseThumb_」の要素に正しく割り当てます。

  デバッグのヒント:

  コードが正しく動作しない場合は、次のようなデバッグ ステートメントを追加することを検討してください。

  console.log("ID number: " + id);
  console.log("Return value of gEBI: " + document.getElementById("horseThumb_" + id));

  ログイン後にコピー
  これは、問題が次の場所にあるかどうかを特定するのに役立ちます。 ID を渡すか、要素が存在するかどうか、または DOM の準備ができる前にコードが実行されているかどうか。

以上がJavaScript で文字列と変数を連結するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。