フォームの値をリスト形式で保存して表示する方法

Question

フォームに入力された値のそれぞれを在庫形式にしてリスト形式<li>で表示したいと思います。

例：フォームに「Thomas」と入力すると、
と表示されます。トーマス
すると、それが表示されるように、1は「ソフィア」を入力：
.Thomas
.Sophia
は 等...

それを行うための最善の方法でしょうか？ここに私のHTMLコードです。

<input id="prenom" type="text"> 
<input id="bouton" type="button" value="récuperer"> 
<p id="message"></p> 

とJavaScript

let prenom = document.getElementById("prenom"); 
let bouton = document.getElementById("bouton"); 
let message = document.getElementById("message"); 
function stocker(){ 
let valeur = prenom.value; 
console.log(valeur); 
prenom.value = ""; 
    message.innerHTML += " "+valeur; 
} 
bouton.addEventListener("click",stocker); 

Answer 1

それを試して、私のために働くようです。たぶん、あなたはあなたが私を理解し、より詳細に達成したいかを説明する必要があります:)

let prenom = document.getElementById("prenom"); 
 
let bouton = document.getElementById("bouton"); 
 
let messageParent = document.getElementById("parent"); 
 
function stocker(){ 
 
let valeur = prenom.value; 
 
    console.log(valeur); 
 
    //prenom.value = ""; 
 
    //message.innerHTML += " "+valeur; 
 
    var p = document.createElement("p"); 
 
    p.innerHTML = valeur; 
 
    messageParent.append(p); 
 
} 
 
bouton.addEventListener("click",stocker);

<input id="prenom" type="text"> 
 
<input id="bouton" type="button" value="récuperer"> 
 
<div id="parent"> 
 
    <p id="message"></p> 
 
<div>