JavaScript

[JavaScript] HTML内の文字を動的に変更する(innerText)

投稿日:2016年10月7日 更新日:

HTML内の文字を動的に変更するには、innerTextを使用します。

HTML内の文字を動的に変更するサンプル

例)id="area1"の要素に文字列を動的に埋め込む

※「innerText」の大文字小文字はこの通り指定しないと動きません。

実行サンプル

ボタンを押すと、テキストボックスに指定した文字列が黄色部分に表示されます。

変更前

解説

  • innerTextを使うと、指定したタグ内のテキスト(文字)のセット/取得ができます。
  • innerTextではセットする値は全て文字列としてみなされるため、HTMLタグをセットしてもタグがそのままセットされてしまいます。
  • HTMLタグを正しく認識させたい場合は、innterHTMLを使用します。
    (詳しくは「HTML内のタグを動的に変更する」をご覧ください。)

スポンサーリンク

スポンサーリンク

-JavaScript
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

[JavaScript] 横位置を指定する(style.textAlign)

JavaScriptで横位置を指定するには、style.textAlignを使用します。 サンプルソース 例)ボタンを押 ...

[JavaScript] 一定時間ごとに処理を実行する

一定時間ごとに処理を実行するサンプルです。 サンプル 例)1秒毎に現在時刻を表示する [crayon-5d094fa96 ...

[JavaScript] コンソールにオブジェクトの中身をテーブル形式で出力する(console.table)

コンソールにオブジェクトの中身をテーブル形式で出力するには、console.tableを使用します。 サンプルソース 例 ...

[jQuery] 画像アップロード時にプレビュー表示する(imageタグ版)

画像アップロード時にプレビュー表示するサンプルです。 サンプルソース 例)画像を指定すると画像をプレビュー表示する [c ...

[JavaScript] セレクトボックスの選択中のインデックス番号を取得する

セレクトボックスの選択中のインデックス番号を取得するサンプルです。 サンプルソース 例)ボタンを押すと、セレクトボックス ...

スポンサーリンク