Soy algo nuevo en esto y estoy tratando de aprender. Agradecería mucho si me explicaran porque al darle click al boton aparece el mensaje de su edad pero en otra parte. Yo lo que quiero es que me aparezca pero abajo de lo que viene en el HTML.
var añoActual = 2021;
var edad;
var datoUsuario = document.getElementById("datoAñoNacimiento");
var boton = document.getElementById("botoncito");
boton.addEventListener("click", edadActual);
function edadActual() {
datoUsuario = parseInt(datoUsuario.value);
edad = añoActual - datoUsuario;
document.write("Tu edad es de " + edad + " años.");
}
<html>
<head>
<title>¿Cuál es tu edad?</title>
</head>
<body>
<h1>
Bienvenido usuario!!
</h1>
<h4>
Para saber su edad ingrese lo que se le solicite.
</h4>
<p>¿Cuál es tu año de nacimiento?
<input type="text" id="datoAñoNacimiento" />
<input type="button" value="click" id="botoncito" />
</p>
<script src="edad.js"></script>
</body>
</html>
document.write
, ya que en algunos casos puede entrar en conflicto con una extensión instalada y también usar este método es considerado una mala práctica en SEO.