Role para elemento específico em JavaScript

Kushank Singh 12 outubro 2023
  1. Use a função scroll() para rolar até um elemento em JavaScript
  2. Use a propriedade href para rolar até um elemento em JavaScript
  3. Use a função scrollIntoView() para rolar até um elemento em JavaScript
Role para elemento específico em JavaScript

Discutiremos como obter o elemento especificado na área visível da janela do navegador em diferentes navegadores usando JavaScript.

Os métodos para realizar essa tarefa são os seguintes.

Use a função scroll() para rolar até um elemento em JavaScript

A função scroll() da interface do elemento rola para um conjunto específico de coordenadas dentro de um determinado elemento. Isso é adequado para Chrome e Firefox e não para o resto.

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

Obtemos o elemento necessário usando o método getElementById(). Passamos isso na função scroll() para rolar até o elemento necessário.

Use a propriedade href para rolar até um elemento em JavaScript

Aqui podemos definir o valor href para apontar para uma âncora na página da web em JavaScript.

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

Aqui, #myDiv é o ID da tag <div> necessária.

Use a função scrollIntoView() para rolar até um elemento em JavaScript

A função scrollIntoView() move o elemento fornecido para a região visível da janela do navegador. Isso é mais adequado para usuários do IE, Safari e Edge.

Por exemplo,

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

A propriedade behaviour descreve como deve ser a aparência do pergaminho. Em nosso exemplo, é definido como smooth. Esta propriedade também pode ser usada na função scroll().