Prevenção de Ação Padrão em JavaScript
Às vezes, é necessário prevenir a ação padrão de uma tag usando JavaScript. Por exemplo, impedir que um link navegue para o seu URL quando clicado. Geralmente, isso é necessário quando usamos o link simplesmente para executar algum código. Nesse caso, o fato de que um clique no link causaria uma navegação não é desejado.
A prevenção da ação padrão é feita
usando o objeto Event. Para isso,
ele possui um método especial preventDefault(),
que deve ser chamado em qualquer lugar do
manipulador de eventos.
Vamos tentar na prática. Suponha que temos o seguinte link:
<a href="/" id="elem">link</a>
Vamos fazer com que o clique no link não cause a navegação para outra página:
let elem = document.querySelector('#elem');
elem.addEventListener('click', function(event) {
event.preventDefault();
console.log('Você não pode seguir este link!');
});
Dados alguns links. Faça com que ao clicar em um link, seu href seja escrito no final do seu texto, e a navegação não ocorra.
Dados dois inputs, um parágrafo e um link. Suponha que os inputs recebam números. Faça com que ao clicar no link, a soma dos números inseridos seja escrita no parágrafo.