ホームページ > ウェブフロントエンド > フロントエンドQ&A > JavaScriptでテキストボックスの値を設定する方法

JavaScriptでテキストボックスの値を設定する方法

PHPz
リリース: 2023-04-21 09:39:13
オリジナル
1683 人が閲覧しました

JavaScript では、テキスト ボックスの値を設定するには、テキスト ボックス オブジェクトのプロパティにアクセスします。テキスト ボックス オブジェクトは、テキスト ボックスの ID 値を通じて取得でき、そのプロパティを操作できます。

JavaScript でテキスト ボックスの値を設定する一般的な方法は次のとおりです。

  1. テキスト ボックスの value 属性を使用してテキスト ボックスの値を設定します

テキスト ボックス オブジェクトの value 属性は、テキスト ボックスの値を取得または設定できます。次の方法でテキスト ボックスの値を設定できます:

document.getElementById("myText").value = "Hello World!";
ログイン後にコピー

このうち、myTextはテキストボックスのID値、「Hello World!」はテキストボックスの値を設定します。

  1. innerHTML 属性を使用してテキスト ボックスの値を設定する

テキスト ボックス オブジェクトは、要素のコンテンツを取得または設定できる innerHTML 属性にもアクセスできます。 (テキストボックスを含む)。以下に示すように:

document.getElementById("myText").innerHTML = "Hello World!";
ログイン後にコピー
  1. setAttribute メソッドを使用してテキスト ボックスの値を設定します

setAttribute は要素の属性を設定するための一般的なメソッドです。このメソッドは 2 つのパラメータを受け取ります。設定する値 プロパティ名とプロパティ値。以下に示すように:

document.getElementById("myText").setAttribute("value", "Hello World!");
ログイン後にコピー

value 属性に加えて、id、name などの他の属性も設定できます。

  1. text 属性を使用してテキスト ボックスの値を設定する

text 属性は、テキスト ボックスのテキスト コンテンツを取得または設定できます。以下に示すように:

document.getElementById("myText").text = "Hello World!";
ログイン後にコピー

text 属性は textarea 要素では使用できず、input 要素でのみ使用できることに注意してください。

  1. innerText または textContent プロパティを使用してテキスト ボックスの値を設定します。

innerText または textContent プロパティは、要素のテキスト コンテンツを設定したり、要素のテキスト コンテンツを取得したりできます。要素。以下に示すように:

// innerText
document.getElementById("myText").innerText = "Hello World!";

// textContent
document.getElementById("myText").textContent = "Hello World!";
ログイン後にコピー

innerText 属性または textContent 属性はブラウザごとに異なる方法で実装される可能性があることに注意してください。

概要:

上記は、JavaScript でテキスト ボックスの値を設定する一般的な方法です。これらの方法により、さまざまなビジネスのニーズに合わせてテキスト ボックスの値を簡単に設定できます。実際のニーズに応じて適切な方法を選択する必要があります。

以上がJavaScriptでテキストボックスの値を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート