Desplácese hasta un elemento específico en JavaScript

Kushank Singh 12 octubre 2023
  1. Utilice la función scroll() para desplazarse a un elemento en JavaScript
  2. Utilice la propiedad href para desplazarse a un elemento en JavaScript
  3. Utilice la función scrollIntoView() para desplazarse a un elemento en JavaScript
Desplácese hasta un elemento específico en JavaScript

Discutiremos cómo obtener el elemento especificado en el área visible de la ventana del navegador en diferentes navegadores usando JavaScript.

Los métodos para realizar esta tarea son los siguientes.

Utilice la función scroll() para desplazarse a un elemento en JavaScript

La función scroll() de la interfaz del elemento se desplaza a un conjunto específico de coordenadas dentro de un elemento dado. Esto es adecuado para Chrome y Firefox y no para el resto.

window.scroll(0, findPos(document.getElementById('myDiv')));

Obtenemos el elemento requerido usando el método getElementById(). Pasamos esto en la función scroll() para desplazarnos al elemento requerido.

Utilice la propiedad href para desplazarse a un elemento en JavaScript

Aquí podemos establecer el valor href para que apunte a un ancla en la página web en JavaScript.

location.href = '#';
location.href = '#myDiv';

Aquí #myDiv es el ID de la etiqueta <div> requerida.

Utilice la función scrollIntoView() para desplazarse a un elemento en JavaScript

La función scrollIntoView() mueve el elemento suministrado a la región visible de la ventana del navegador. Esto es más adecuado para usuarios de IE, Safari y Edge.

Por ejemplo,

document.querySelector('#myDiv').scrollIntoView({behavior: 'smooth'});

La propiedad behavior describe cómo debería verse el desplazamiento. En nuestro ejemplo, se establece en smooth. Esta propiedad también se puede utilizar en la función scroll().