Para cambiar la URL en el navegador sin cargar la nueva página, podemos usar el método history.pushState() y el método replaceState() de JavaScript. Para mostrar la URL del navegador antes de cambiar la URL, usaremos window.location.href en la función alert() y lo usaremos nuevamente después de cambiar la URL del navegador.
Nota: El método history.pushState() combina HTML 5 History y JavaScript pushState().
Sintaxis:
alert(" Message:" + window.location.hrf);
Los siguientes ejemplos ilustran el enfoque anterior:
Ejemplo 1:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function geeks() {
alert("The current URL of this"
+ " page is: " + window.location.href);
}
function change_url() {
window.history.pushState("stateObj",
"new page", "changedURL.html");
alert("The URL of this page is: "
+ window.location.href);
}
</script>
</head>
<body onload="geeks()">
<a href="javascript:change_url()">
Click to change url
</a>
</body>
</html>
Producción:
Ejemplo 2:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function geeks() {
alert("The current URL of this "
+ "page is: " + window.location.href);
}
function change_url() {
window.history.replaceState("stateObj",
"new page", "changedURL.html");
alert("The URL of this page is: "
+ window.location.href);
}
</script>
</head>
<body onload="geeks()">
<a href="javascript:change_url()">
Click to change url
</a>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por VijayanathanJayaprakash y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA