Estoy tratando de obtener una entrada en un formulario html y luego usar el detector de eventos en un botón para moverme a otra página html, así como cambiar el HTML interno de la segunda página html a la entrada de la primera página, pero solo la página cambia pero el HTML interno no cambiar esto es html principal
<form> <label for="fname">First name:</label><br> <input type="text" id="fname" name="fname"><br> </form> <button id="Butn1" onclick="location.href = 'resume.html';">Submit</button> <script src="main.js"></script>esta es la segunda pagina html
<div> Name: <br> <p id="fname1">hello</p> </div> <script src="main.js"></script>y este es el archivo js
document.getElementById("Butn1").addEventListener("click",func1); var a=document.getElementById("fname").value; function func1(){ document.getElementById("fname1").innerHTML = a; }puedes usar de esta manera.
si esta es tu primera página:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <form> <label for="fname">First name:</label><br> <input type="text" id="fname" name="fname"><br> </form> <button id="Butn1" onclick="handleClick()">Submit</button> <script> function handleClick() { location.href = 'secondPage.html?name=' + document.getElementById("fname").value; } </script> </body> </html>esta seria tu segunda pagina
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script> const urlParams = new URLSearchParams(window.location.search); const myParam = urlParams.get('name'); alert(myParam); </script> </body> </html>pero no se recomienda usar esto si su cadena es demasiado larga.