Javascript-форум - как выделять последовательности искомых подстрок?

Javascript-форум (https://javascript.ru/forum/)

- Events/DOM/Window (https://javascript.ru/forum/events/)

- - как выделять последовательности искомых подстрок? (https://javascript.ru/forum/events/79074-kak-vydelyat-posledovatelnosti-iskomykh-podstrok.html)

как выделять последовательности искомых подстрок?

Подскажите, как выделять последовательности искомых подстрок?

Исходная строка: <br><input type="text" id="text" placeholder="Введите текст..."><br/><br/>
Искомые совпадения: <br><input type="text" name="search" id="search" placeholder="Введите текст...">
<p id="result"></p>

search.oninput = function() {
   //подскажите, как это можно сделать
   }

поиск последовательности слов

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

<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    label{
        display: flex;
        flex-direction: column;
    }
    #result b{
        color: #FF0000;
    }

  </style>
</head>
<body>
<label>Исходная строка: <input type="text" id="text" placeholder="Введите текст..." value="ЗАКИРОВ АМИРЗЯН ГАЗИЗЬЯНОВИЧ"></label>
<label>Искомые совпадения: <input type="text" name="search" id="search" placeholder="Введите текст..." value="з а г"></label>
<p id="result"></p>
<script>
search.addEventListener('input', _=>{
    let txt = text.value, patern = search.value.trim();
    if(txt && patern) {
    let ar = patern.split(/\s+/);
    let reg = ar.map(_=> `(^|\\s+)(${_})(\\S*)`);
    patern = new RegExp(reg.join(''), 'i');
    txt = txt.replace(patern, a => ar.reduce((a,_, i) => {
    patern = new RegExp(reg[i], 'i');
    return a.replace(patern, '$1<b>$2</b>$3')
    }, a)
    )
    };
    result.innerHTML = txt;
})
//для теста
let event = new Event("input");
    search.dispatchEvent(event);

</script>

</body>
</html>

рони,
а как совместить, чтобы не только с начала строки искались последовательности, а допустим в исходной строке будет "спасибо" и при искомой "си" выделило бы их в результирующей строчке?

Цитата:

Сообщение от Adrikks

с начала строки искались последовательности

ищется любая последовательность начала слов в строке, а не только сначала строки.

Цитата:

Сообщение от Adrikks

а как совместить,

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

примеры что на входе, что на выходе.

рони,
Понимаю. Попробую уточнить.

Adrikks,
пишите текстом, а не картинкой. :)

Adrikks,

<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    label{
        display: flex;
        flex-direction: column;
    }
    #result b{
        color: #FF0000;
    }

  </style>
</head>
<body>
<label>Исходная строка: <input type="text" id="text" placeholder="Введите текст..." value="спасибо ЗАКИРОВ АМИРЗЯН ГАЗИЗЬЯНОВИЧ главный врач главный врач"></label>
<label>Искомые совпадения: <input type="text" name="search" id="search" placeholder="Введите текст..." value="си з мир г"></label>
<p id="result"></p>
<script>
search.addEventListener('input', _=>{
    let txt = text.value, patern = search.value.trim();
    if(txt && patern) {
    let ar = patern.split(/\s+/);
    let reg = ar.map(_=> `(^\\S*|\\s+\\S*)(${_})(\\S*)`);
    patern = new RegExp(reg.join(''), 'ig');
    txt = txt.replace(patern, a => ar.reduce((a,_, i) => {
    patern = new RegExp(reg[i], 'i');
    return a.replace(patern, '$1<b>$2</b>$3')
    }, a)
    )
    };
    result.innerHTML = txt;
})
let event = new Event("input");
    search.dispatchEvent(event);

</script>

</body>
</html>

рони,
Вот не знаю как правильно объяснить, как именно должно работать)
Поэтому показываю на примере картинки, каким должен быть результат)

Adrikks,
пример выше, смотрите.

рони,
Да, думаю это именно то, что мне нужно было)
Спасибо за ваше время :)