Показать сообщение отдельно
  #7 (permalink)  
Старый 13.12.2019, 19:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

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>
Ответить с цитированием