A ver, explico: se crea un array con cada una de las palabras escritas en el input, ejemplo:
const arr = ['se', 'crea', 'un', 'array', 'con', 'cada', 'una', 'de', 'las', 'palabras', 'escritas', 'en', 'el', 'input']
Ahora, de este array quiero buscar en este string:
Las palabras de los input son muy importantes para los array
Las palabras que coincidan con cada elemento del array y colocarlo en negrita quedando así: Las palabras de los input son muy importantes para los array
Tomando en cuenta que las palabras que aparecen y están en el array son ['las', 'palabras', 'de', 'input', 'array']
Lo he intentado con el siguiente código pero solo se coloca en negrita el último elemento:
input.addEventListener('keyup', (e) => {
let boxSearch = input.parentElement.parentElement.querySelector('.search-match')
boxSearch.innerHTML = ''
let text = e.target.value.toLowerCase();
for (let item of dataAutocomplete) {
let name = item.name.toLowerCase();
let nameFilter = name.replace(text, `<strong>${ text }</strong>`)
var filterLettering = text.split(' ');
var yes = 0;
let filterText;
for (var filter of filterLettering) {
if (name.indexOf(filter) > -1) {
yes++;
filterText = name.replaceAll(filter, `<strong>${ filter }</strong>`)
}
}
if (yes === filterLettering.length) {
boxSearch.innerHTML += /*html*/ `
<div class="item-match">
<span style="text-transform: capitalize;">
${ filterText }
</span>
</div>`
}
}
})
¿Alguno me podría ayudar por favor?