[Dúvida] Como aparecer resultados ao pesquisar na barra de pesquisa

Olá Diogo! Que bom que você está estudando front-end! Para fazer com que os resultados apareçam ao pesquisar na barra de pesquisa em um site, você pode utilizar JavaScript para criar uma função que será acionada quando o usuário digitar algo na barra de pesquisa.

Primeiro, você precisa adicionar um evento de digitação à barra de pesquisa. Você pode fazer isso utilizando o método addEventListener e o evento input. Por exemplo:

const barraPesquisa = document.querySelector('#barra-pesquisa');

barraPesquisa.addEventListener('input', function() {
  // Aqui você pode chamar a função que irá buscar os resultados e exibi-los
});

Dentro dessa função, você pode utilizar uma requisição AJAX para buscar os resultados em um servidor ou utilizar um array de dados já existente no seu código. Depois de obter os resultados, você pode manipular o DOM para exibi-los na página.

Por exemplo, suponha que você tenha um array de objetos com os resultados da pesquisa:

const resultados = [
  { nome: 'Resultado 1', url: 'https://exemplo.com/resultado1' },
  { nome: 'Resultado 2', url: 'https://exemplo.com/resultado2' },
  // ...
];

function buscarResultados(pesquisa) {
  // Aqui você pode filtrar os resultados de acordo com o texto digitado na barra de pesquisa
  const resultadosFiltrados = resultados.filter(resultado => resultado.nome.includes(pesquisa));

  // Aqui você pode manipular o DOM para exibir os resultados na página
  // Por exemplo, criar elementos <a> para cada resultado e adicioná-los a um elemento <ul>
}

Dentro da função que é acionada pelo evento input, você pode chamar a função buscarResultados passando o texto digitado na barra de pesquisa como parâmetro.

Lembre-se de adaptar o código de acordo com a estrutura do seu site e com a forma como você deseja exibir os resultados.

Você pode aprender isso e muito mais aqui nessa formação de JavaScript para Front-End:

• Desenvolva aplicações Web com JavaScript

Espero que isso te ajude! Se tiver mais alguma dúvida, é só me dizer.

Espero ter ajudado, abraços e bons estudos!