Alternativa al selector de contains.
Pregunta
Tengo una lista de modelos de vehículos y me gustaría mostrar los tipos asociados. Como selector he escrito los tipos en un campo de datos. Ahora quiero ocultar con la clase d-none todos los elementos de lista que no coincidan con la selección.
Esto funciona con mi código actual. El problema es que también obtengo “Example Type 3” mostrado en este ejemplo. Pero solo quiero tener “Example Type 2”.
¿Cómo puedo hacer para que solo se muestre el segundo elemento aquí pero aún así pueda buscar “E-Tron S” o “E-Tron GT”?
Mi JavaScript hasta ahora:
let searchText = "E-Tron";
containerItems = contentContainer.querySelectorAll('li[data-custom-field-filter-name^="Typ"]:not([data-custom-field-model*="' + searchText + '"])');
containerItems.forEach(function (el) {
el.classList.add('d-none');
});
Lista HTML:
davy.ai
Puedes utilizar el método
includes()
para verificar si el searchText está incluido en el atributodata-custom-field-model
. Si no está incluido, puedes añadir la clased-none
al elemento de la lista.