Actualizar la página en jQuery

Shraddha Paghdar 30 enero 2023
  1. Use el método location.reload() para actualizar la página en jQuery
  2. Utilice el método history.go() para actualizar la página en jQuery
Actualizar la página en jQuery

En la publicación de hoy, aprenderemos cómo actualizar la página usando los objetos location e history en jQuery.

Use el método location.reload() para actualizar la página en jQuery

Uniform Resource Locator es la ubicación de la página, representada por la interfaz de location. Los cambios realizados en él se reflejan en el objeto al que se refiere.

Las interfaces de documento y ventana tienen una localización asociada a la que se puede acceder mediante Document.location y Window.location, respectivamente.

Al igual que el botón Refresh, la técnica location.reload() recarga la URL existente. El método location.reload() es un método JavaScript muy conocido, por lo que no se necesita jQuery para ello.

La recarga puede colgar y lanzar una DOMException SECURITY_ERROR. Esto ocurre si la base del script que llama a location.reload() difiere del origen de la página que posee el objeto location.

Sintaxis:

reload();

Entendámoslo con el siguiente ejemplo.

Nota: El siguiente código no se puede ejecutar de esta manera y no tiene salida. Debe agregarse a un código existente para mostrar resultados.

Código HTML:

<p>Hello World!</p>
<button type="button" id="btn">Reload</button>

Código JavaScript:

$('#btn').click(function() {
  location.reload();
});

Intente ejecutar el fragmento de código anterior en cualquier navegador que admita jQuery. Va a recargar la página.

Utilice el método history.go() para actualizar la página en jQuery

El método history.go() carga una página específica del historial de la sesión. Puede usarlo para avanzar y retroceder en el historial según el valor de un parámetro; este método es asíncrono.

El método history.go() carga una URL del historial del navegador en función del parámetro pasado. Si el parámetro dado es 0, recargará la página actual.

Sintaxis:

history.go(0);

Entendámoslo con el siguiente ejemplo.

Nota: El siguiente código no se puede ejecutar de esta manera y no tiene salida. Debe agregarse a un código existente para mostrar resultados.

Código HTML:

<p>Hello World!</p>
<button type="button" id="btn">Reload</button>

Código JavaScript:

$('#btn').click(function() {
  history.go(0);
});

Intente ejecutar el fragmento de código anterior en cualquier navegador que admita jQuery. Va a recargar la página.

Vea la demostración aquí.

Shraddha Paghdar avatar Shraddha Paghdar avatar

Shraddha is a JavaScript nerd that utilises it for everything from experimenting to assisting individuals and businesses with day-to-day operations and business growth. She is a writer, chef, and computer programmer. As a senior MEAN/MERN stack developer and project manager with more than 4 years of experience in this sector, she now handles multiple projects. She has been producing technical writing for at least a year and a half. She enjoys coming up with fresh, innovative ideas.

LinkedIn

Artículo relacionado - jQuery Page