@holfizz

Как сделать чтобы поиск выводил все элементы а не первый?

вот js
document.querySelector('#elastic').oninput = function (){
    let val = this.value.trim();
    let block = document.querySelector('.block')
    let elasticItem = document.querySelectorAll('.elastic > * ')
    if(val !== ''){
        for (const elem of elasticItem) {
            if(elem.innerText.search(val) === -1){
                block.classList.remove('active')
               }else{
                   elem.classList.remove('hide')
                   let str = elem.innerText;
                    elem.innerHTML = insertMark(str,elem.innerText.search(val),val.length)
                   if(elem.innerText.length >=1){
                       block.classList.add('active')
                       block.innerHTML = elem.innerHTML
               }
           }
        }
    }
    else{
        for (let elem of elasticItem) {
            elem.classList.remove('hide')
            elem.innerHTML = elem.innerText;
            block.classList.remove('active')

        }
    }
}

function insertMark(string,pos,len){
    return string.slice(0,pos)+ `<mark>`+string.slice(pos, pos+len)+`</mark>`+string.slice(pos +len)
}

вот pug
div
    input(id='elastic')
ul.elastic
    a Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias amet, aperiam corporis cumque deserunt esse facilis illum impedit minus mollitia nam necessitatibus officiis praesentium quos sit. Ad consequuntur delectus nihil nisi omnis, reiciendis sequi ullam. Dolorem eaque fugit minus molestiae nostrum quos soluta voluptate. Ad, at blanditiis debitis explicabo maiores minima necessitatibus officia quos recusandae reiciendis repellendus sit totam! Accusamus aliquam aliquid animi at atque consectetur consequuntur distinctio excepturi expedita atum. Cumque harum maxime obcaecati quis.
div
    .block

поиск работает отлично но отмечает только первый элемент а не все, если не понятно то пишем в input 'e'
он находит первое совпадение и завершает работу а надо чтобы он весь текст проверил и вывел похожие
  • Вопрос задан
  • 104 просмотра
Пригласить эксперта
Ответы на вопрос 1
Alexander3928
@Alexander3928
На Ютубе напиши "live Search"
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы