JavaScript を使用して要素の ID を変更するにはどうすればよいですか?

一般的に、HTML ドキュメント内の要素の ID は一意であり、要素に割り当てることができるのは 1 回だけです。ただし、ID は、新しい ID の一意性に関する同じルールに従って、JavaScript を使用して後で変更できます。また、新しい ID を含めることができるのは 1 つの要素のみです。この記事では、JavaScript を使用して要素の ID を変更する方法を見ていきます。

JavaScript は、id 属性を提供または使用して、任意の要素の ID を取得したり、ドキュメント内の任意の HTML 要素に新しい ID を変更または追加したりすることを可能にします。

コード例を参考に、id 属性を使用して JavaScript を通じて HTML ドキュメント内の要素の ID を変更する方法を学びましょう。

＃＃＃文法＃＃＃

次の構文は、id 属性を使用して変更、新しい ID を取得、HTML 要素に新しい ID を追加する方法を説明します -

リーリー

上記の構文では、まず HTML DOM を使用して ID を変更する HTML 要素を選択し、次に

id

属性を使用してその右側に新しい ID 割り当て操作を割り当てます。ドット演算子の記号。 コード例を通じて、HTML ドキュメント内の要素の ID を変更する

id

属性の実際の実装を理解しましょう。 ＃＃＃アルゴリズム＃＃＃

ステップ 1

- 最初のステップでは、ユーザーからの入力として新しい ID を取得するための入力要素を追加し、後でその ID を使用して同じ入力要素の ID を変更します。属性 。

• ステップ 2
- このステップでは、onclick イベントを使用して HTML ドキュメントにボタン要素を追加します。このイベントは後で JavaScript 関数を呼び出して、入力要素の ID を変更します。

• ステップ 3

- 次のステップでは、入力要素を取得し、要素の初期 ID をユーザーに表示して、要素の ID の変化を簡単に確認できるようにします。

• ステップ 4
- 4 番目のステップでは、入力要素を再度取得し、その ID をユーザーが入力フィールドに入力したテキストに等しく設定する JavaScript 関数を定義します。そして、id 属性を使用して、その ID をこのテキストに変更します。

• ステップ 5
- 最後のステップでは、id 属性を使用して要素に割り当てられた新しい ID を表示し、関数を値として onclick イベントに割り当てます。後で使用 ユーザーがボタンをクリックしたときに呼び出されます。

• ＃＃＃例＃＃＃ 次の例は、id 属性を使用して HTML ドキュメント内の要素の ID を変更する方法を示しています -

  リーリー
上記の例では、JavaScript の id 属性を使用して input 要素の ID を変更し、input 要素に割り当てられた新旧の ID をユーザーの画面に表示しました。

関数を渡すのではなく、onclick イベント内の要素の ID を直接変更する別のコード例を見てみましょう。

＃＃＃アルゴリズム＃＃＃

上記の例とこの例のアルゴリズムはほぼ似ています。以下の例に示すように、ボタン要素の onclick イベントで渡される値を変更するだけです。

＃＃＃例＃＃＃

次の例では、前の例のように入力要素の ID を変更するために前のアルゴリズムで行う必要がある変更について説明します -

リーリー

上の例では、入力要素の ID を変更できますが、この場合、要素に新しい ID 値を静的に割り当てるため、以前の ID を選択した ID に置き換えることはできません。

この記事では、選択した ID とその要素に付与する静的 ID を使用して、HTML ドキュメント内に存在する要素の ID を変更する方法を学びました。この静的 ID は一意である必要があり、ドキュメントのみに使用されます。 id の単一要素を含めることができます。

以上がJavaScript を使用して要素の ID を変更するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。