Von der Suchanfrage zum passenden Ziel

const INDEX = [
  {
    titel: 'Öffnungszeiten',
    url: '/kontakt/oeffnungszeiten',
    text: 'Montag bis Freitag 9 bis 17 Uhr.'
  },
  {
    titel: 'Anfahrt und Parken',
    url: '/kontakt/anfahrt',
    text: 'Bushaltestelle Markt und Zugang ohne Stufen.'
  },
  {
    titel: 'Preise und Leistungen',
    url: '/leistungen/preise',
    text: 'Leistungen mit Dauer und Preis.'
  }
];

const formular = document.getElementById('suche');
const feld = document.getElementById('suchfeld');
const status = document.getElementById('such-status');
const ausgabe = document.getElementById('such-ausgabe');
const liste = document.getElementById('such-treffer');
const leer = document.getElementById('such-leer');

function normalisieren(text) {
  return text.toLocaleLowerCase('de-DE').trim();
}

function suchen(begriff) {
  const woerter = normalisieren(begriff).split(/\s+/);
  return INDEX.filter((eintrag) => {
    const inhalt = normalisieren(
      eintrag.titel + ' ' + eintrag.text
    );
    return woerter.every((wort) => inhalt.includes(wort));
  });
}

function trefferElement(eintrag) {
  const punkt = document.createElement('li');
  const link = document.createElement('a');
  const text = document.createElement('p');
  link.href = eintrag.url;
  link.textContent = eintrag.titel;
  text.textContent = eintrag.text;
  punkt.append(link, text);
  return punkt;
}

function ausgeben(treffer, begriff) {
  liste.replaceChildren(...treffer.map(trefferElement));
  ausgabe.hidden = false;
  leer.hidden = treffer.length !== 0;
  status.textContent = treffer.length === 0
    ? 'Keine Treffer für „' + begriff + '“.'
    : treffer.length + ' Treffer für „' + begriff + '“.';
}

formular.addEventListener('submit', (event) => {
  event.preventDefault();
  const begriff = feld.value.trim();
  if (!begriff) return;
  ausgeben(suchen(begriff), begriff);
});