Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Поиск из нескольких слов (https://javascript.ru/forum/dom-window/80794-poisk-iz-neskolkikh-slov.html)

WadimS 02.08.2020 14:03

Поиск из нескольких слов
 
В условии поиска может быть задано несколько слов, например: 'брак техотсев инструмент' - нужно из списка UL/LI выбрать записи в которых встречается любое из слово из поиска.
Поиск идёт по значению атрибута
<li defected='Некондиционная поставка, брак. Списание в затраты.'>

Хотелось бы получить строку с условием поиска. Что-то вроде такого:
[defected*='брак'||'техотсев'...]

В регулярных выражениях я полнейший профан... Не бейте, но кроме делающей совершенно дебильную замену ничо не выдумал:
text = text.replace(/ /gim, '[*=$1]');

рони 02.08.2020 16:17

WadimS,
зачем придумывать свои атрибуты, если есть data- ?

рони 02.08.2020 16:33

фильтрация по списку слов
 
WadimS,
<!doctype html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
    li.red {
        background-color: hsla(0, 100%, 50%, 1);
    }
    </style>
</head>
<body>
    <ul>
        <li></li>
        <li data-defected='Некондиционная поставка, брак. Списание в затраты.'></li>
        <li data-defected='test'></li>
        <li data-defected='ИНСТРУМЕНТЫ'></li>
    </ul>
  <script>
const filterList = (list, value) => {
    let newList = [],
        words = value.split(/\s+/).map(str => str.toLowerCase());
    for (let li of list) {
        let defected = li.dataset.defected;
        if (defected) {
            defected = defected.toLowerCase();
            let include = words.some(str => defected.includes(str));
            if (include) newList.push(li)
        }
    }
    return newList;
}
let list = document.querySelectorAll('li'),
    value = 'брак техотсев инструмент';
list = filterList(list, value);
list.forEach(elem => elem.classList.add('red'));
</script>
</body>
</html>

WadimS 02.08.2020 21:04

рони, как я понимаю, использование "data-" и добавление атрибута вопрос семантики. Т.е. как бы и без особой разницы.

Принципиально преобразование строки поиска в массив и работа уже с массивом?
А сформировать строку с условием поиска ('брак'||'техотсев'), так, как Вы же и советовали, не получится?

laimas 02.08.2020 21:37

var find = 'брак техотсев инструмент';

console.log(new RegExp(find.replace(/\s+/g, '|'), 'gi'))

WadimS 02.08.2020 21:55

laimas, спасибо!

рони 02.08.2020 23:07

WadimS,
на всякий случай.
если в строке есть служебные символы, их нужно перед RegExp экранировать.

WadimS 02.08.2020 23:13

рони, само-собой!

рони 02.08.2020 23:19

Цитата:

Сообщение от WadimS
рони, как я понимаю, использование "data-" и добавление атрибута вопрос семантики. Т.е. как бы и без особой разницы.

если возможно то лучше совсем без любых атрибутов, есть данные их и фильтруйте, а не извлекайте из атрибутов.


Часовой пояс GMT +3, время: 18:20.