Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #31 (permalink)  
Старый 16.12.2019, 16:15
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Adrikks,
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style>
        label {
            display: flex;
            flex-direction: column;
        }
        #result mark {
            color: #FF0000;
        }
    </style>
</head>
<body>
    <label>
        Исходная строка:
        <input id="text" placeholder="Введите текст..." value="АЛИЕВА БАЙНАТ АБДУРАХМАНОВНА">
    </label>
    <label>
        Искомые совпадения:
        <input id="search" placeholder="Введите текст..." value="а б">
    </label>
    <p id="result"></p>
    <script>
RegExp.escape = s => s.replace(/[[\\^$.|?*+()]/gim, "\\$&");
function mark(string) {
    const node = document.createElement("mark");
    node.textContent = string;
    return node;
}
search.addEventListener("input", () => {
    const value = text.value;
    let parts = search.value.trim();
    const length = parts.length;
    if(!value || !length) {result.textContent = text.value; return};
    parts = parts.split(/\s+/).map(pattern => new RegExp("(" +RegExp.escape(pattern) +")", "i"));
    result.textContent = "";
    let temp = [];
    for (let i = 0; i < value.length; ) {
        let k = i, arrFindIndex = [];
        let found = parts.every(reg => {
        reg.lastIndex = 0;
        let match = reg.exec(value.slice(k));
        if(match) {
        k += match.index
        arrFindIndex.push(k, k += match[0].length);
        return true
        }
        return false;
        });
        if(found) {i = k; temp.push(...arrFindIndex)}
        else i++;
    }
    let index = 0;
    for (let i = 0; i < temp.length; i += 2){
    result.append(
            value.slice(index, index = temp[i]),
            mark(value.slice(index, index = temp[i + 1]))
        );
    }
   result.append(value.slice(index));
});
search.dispatchEvent(new Event("input"));
</script>
</body>
</html>
Ответить с цитированием
  #32 (permalink)  
Старый 16.12.2019, 18:39
Интересующийся
Отправить личное сообщение для Adrikks Посмотреть профиль Найти все сообщения от Adrikks
 
Регистрация: 13.12.2019
Сообщений: 14

рони,
спасибо большое за помощь и за терпение.
Ответить с цитированием
  #33 (permalink)  
Старый 17.12.2019, 16:40
Новичок на форуме
Отправить личное сообщение для JoenRules Посмотреть профиль Найти все сообщения от JoenRules
 
Регистрация: 17.12.2019
Сообщений: 1

рони,
решаю подобную задачу. Можете объяснить, что вы делаете здесь?
RegExp.escape = s => s.replace(/[[\\^$.|?*+()]/gim, "\\$&");

и здесь
let found = parts.every(reg => {
        reg.lastIndex = 0;
        let match = reg.exec(value.slice(k));
        if(match) {
        k += match.index
        arrFindIndex.push(k, k += match[0].length);
        return true
        }
        return false;
        });
        if(found) {i = k; temp.push(...arrFindIndex)}
        else i++;
    }
    let index = 0;
    for (let i = 0; i < temp.length; i += 2){
    result.append(
            value.slice(index, index = temp[i]),
            mark(value.slice(index, index = temp[i + 1]))
        );
    }
   result.append(value.slice(index));

(комментарии возможно), если не трудно. Относительно недавно начала изучать JavaScript.
Ответить с цитированием
  #34 (permalink)  
Старый 17.12.2019, 17:27
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

JoenRules,
RegExp.escape экранирование служебных символов https://learn.javascript.ru/regexp-escaping
. это любой символ в RegExp
\. это просто точка
если в строке поиска есть точка, нужно "уточнить" (экранировать) что это именно точка.
подробнее по ссылке.
let found = parts.every(reg => { // parts -> массив всех совпадений
       // every ->  каждое совпадение должно быть в проверяемой строке
        reg.lastIndex = 0; //искать с начала строки
        let match = reg.exec(value.slice(k));//проверка совпадения
        if(match) {//если совпадение есть
        k += match.index
        arrFindIndex.push(k, k += match[0].length); //запоминаем совпадение с такого символа по такой
        return true // продолжаем поиск
        }
        return false;// прекращаем поиск если хотябы одного совпадения нет
        });
        if(found) {i = k; temp.push(...arrFindIndex)} //если поиск был удачный сокращаем строку на длину совпадений
        // и сохраняем все сопадения
        else i++; //иначе сокращаем строку на один символ
        // продолжаем поиск по строке пока есть длина строки
    }
    let index = 0;//вывод результата с начала строки
    for (let i = 0; i < temp.length; i += 2){// цикл по участкам совпадения
    result.append(
            value.slice(index, index = temp[i]), // вывод строки до совпадения
            mark(value.slice(index, index = temp[i + 1]))// вывод элемента mark с текстом совпадения
        );
    }
   result.append(value.slice(index)); //вывод последнего участка строки
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Открытие div блока при первом визите на сайт Nushaba Общие вопросы Javascript 28 20.12.2013 21:24
Как организовать RichEdit arma Элементы интерфейса 2 18.02.2010 14:57
О наследовании событий, или как корректно его отменить. JCShen Events/DOM/Window 8 09.02.2010 00:00
предложение по поводу последовательности уроков aldan8 Сайт Javascript.ru 12 10.09.2009 10:33
Как правильно послать XML в POST запросе LowCoder AJAX и COMET 10 15.07.2009 23:20