Estoy creando una función de búsqueda en javascript que tiene texto normal y elegante.
El problema es al buscar: Valor de texto elegante: 𝗡𝗲𝗲𝗱 𝘁𝗼 𝗞𝗻𝗼𝘄 𝗔𝗯𝗼𝘂𝘁
No funciona.
document.getElementById("search").addEventListener("keyup", function(evt) { [].forEach.call(document.querySelectorAll(".subjects .subject"), function(subject) { if (subject.textContent.indexOf(evt.target.value) === -1) { subject.classList.add("hide"); } else { subject.classList.remove("hide"); } }); }, false); <input id="search"></input> <div class="subjects"> <div class="subject">soccer</div> <div class="subject">dancing</div> <div class="subject">𝗬𝗼𝘂 𝗡𝗲𝗲𝗱 𝘁𝗼 𝗞𝗻𝗼𝘄 𝗔𝗯𝗼𝘂𝘁 </div> </div>Normalice la cadena con descomposición de compatibilidad antes de buscar
const subjects = document.querySelectorAll(".subjects .subject"); const normalisationForm = "NFKC"; document .getElementById("search") .addEventListener("input", ({ target: { value } }) => { subjects.forEach(({ classList, textContent }) => { const normalised = textContent.normalize(normalisationForm).toLowerCase(); classList.toggle("hide", !normalised.includes(value.toLowerCase())); }); }); .hide { text-decoration: line-through; opacity: .6; } <input id="search" /> <div class="subjects"> <div class="subject">soccer</div> <div class="subject">dancing</div> <div class="subject">𝗬𝗼𝘂 𝗡𝗲𝗲𝗱 𝘁𝗼 𝗞𝗻𝗼𝘄 𝗔𝗯𝗼𝘂𝘁 </div> </div>