プログラミングで暮らしをハック
ITで暮らしを便利にするブログ
Web制作のノウハウ

【JavaScript】入力フォームに入力した値を画面に表示する方法

入力フォームに入力した値を表示する方法をご紹介します。

以下のサンプルを試してみてください。
フォームに入力して、実行ボタンを押してください。


 

 

HTML

以下サンプルコードです。

<input id="in" type="text">
<button id="display">実行</button>
<p id="out"></p>

 

JavaScript

以下サンプルコードです。

let ipt = document.getElementById('in');
let btn = document.getElementById('display');
let elem = document.getElementById('out');
btn.addEventListener('click', () =>{
  elem.innerHTML = ipt.value;
});