Tengo una pregunta sobre la función JS localStorage() en relación con querySelectorAll(). Aquí está mi código:

 const comments = Array.from(document.querySelectorAll('input[type="submit"]')); comments.forEach(comment => { comment.addEventListener('click', custom_text); }); function custom_text() { let inputs = Array.from(document.querySelectorAll('input[type="text"]')); let textblocks = Array.from(document.querySelectorAll('div.comment_form')); let length = inputs.length; for (let i = 0; i < length; i++) { if (inputs[i].value !== "") { let text = document.createTextNode("User says: " + inputs[i].value); let para = document.createElement("div"); localStorage.setItem("comment" + i, inputs[i].value); let test = localStorage.getItem("comment" + i); console.log(test); para.appendChild(text); textblocks[i].appendChild(para); inputs[i].value = ""; } } }

Y el HTML:

 <div class="d-flex"> <input class="form-control ms-2 border-0" type="text" name="commenttext" placeholder="Kommentieren ..." size="50"> <input class="btn btn-link m-2 text-decoration-none" type="submit" name="comment" value="post"> </div> <div class="ms-2"> <span href="#" class="text-decoration-none text-black-50 custom_font">All comments:</span> <div class="fw-lighter comment_form"> </div> </div>

Tenga en cuenta que este no es el único formulario de comentarios, ya que hay muchas publicaciones con las etiquetas html exactas en el sitio. Me gustaría guardar todos los comentarios con localStorage; mi problema era que solo podía guardar un comentario por campo de comentario, por lo que si publicaba otro, el último se sobrescribía ... Además, no solo quiero consolar .iniciar sesión, quiero que sea hijo de "para", que tampoco funcionará.

Espero haber dejado mi pregunta lo suficientemente clara y sería feliz si alguien pudiera ayudarme :)