【Javascript】TEXTAREAに入力された文字を、htmlの別の場所にパースするには？

Question

  <textarea id="textarea"></textarea>
  <div id="output"></div>

<script>
document.getElementById("output").innerHTML = document.getElementById("textarea").value;
</script>

名前をTEXTAREAに入力したら、
それをDIVに表示させたいのです。

どのようにPARSEすれば良いのかご教示頂けますでしょうか？

下記を追記しました。言葉が足らず申し訳ございませんでした。
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

１．このようなコードだと、何も変わりません。
どこかいけないのか調べています。

document.getElementById("output").innerHTML = document.getElementById("textarea").value;

２．ボタンは使わないで、リアルタイムに表示させたいです。

３．ライブラリーやフレームワークは使いません。
HTMLとCCSだけです。

４．名前を入れたら、
名刺のデザインに名前が入力され、
どのように表示されるのか、
それをぱっと見て分かる、ツールを作成しています。

Comments

[kei344]

ご自身で書かれたコードを質問文に追記いただいたほうが回答を得られやすいと思います。

[takasima20]

リアルタイムにやりたいのか、フォーカスが外れた時とか、何かボタンが押された時とか、その辺のイメージも質問に追記するといいと思います。

[matobaa]

なにかライブラリとかフレームワークとか使ってますか

Answer 1

コードが無いので何とも言えませんが、outputのinnerHTMLにtextareaのvalueを入れてやれば、ブラウザ側でパースします。

追記

document.getElementById('output').addEventListener('change',function(){
  //処理
});
```とかやらないと何も起きないですよ。
この意味分かりますか？　それでもリアルタイムではないですけど。

Comments

[shi_ue]

しかし、なんで lang="en" なんですかね？

[退会済みユーザー]

質問を編集しました。
①コードを追記しました。
②ユーザーは外国人なので、英語で作っています。

[退会済みユーザー]

ありがとうございます。
AddEventListnerを勉強します。
素人なのですいません。本当に感謝します。

Answer 2

いまの状態では画面が表示された時に JavaScript が実行され
それ以降はなにも動かないつくりになってますね。
textsrea に onChange で動く処理を設定すれば
いいと思います。
http://javascript.eweb-design.com/1202_ta.html

Comments

[退会済みユーザー]

ありがとうございます。勉強します。