let re = /прекрасная строка/gi; let str = "Моя прекрасная строка. И еще одна."; for(let r; r = re.exec(str); ) { console.log(r.join(" - "), r.index) }

Не хочу делать еще один поиск но уже по дум, я от него ушел а теперь обратно, как-то не камельфо.

Уже все описал и экранирование и все, работает гуд.

Пока это конечно самый правильный вариант

Он может выбрать от 1 до любого количества

```

Но по умолчанию 5

let reObj = {p: "прекрасная строка", flags: "gi"}; let str = "Моя прекрасная строка. И еще одна прекрасная строка."; let re = new RegExp(reObj.p, reObj.flags); for(let r; r = re.exec(str); ) { console.log(r.join(" - "), r.index) }

let re = /прекрасная строка/gi; let str = "Моя прекрасная строка. И еще одна."; for(let r; r = re.exec(str); ) { console.log(r.join(" - "), r.index) }

Не совсем понял

так экранирую return temp.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");

раз пользователю, дают возможность регулярку вводить, наверное это опытный пользователь, понимающий их синтаксис

в любом случае try {} catch тестовый добавить не кто не помешает

а экранирование служебных символов думаю тривальное дело, там же еще и в бд это идет

то есть для бд тоже подготавливается как то

let reObj = {p: "прекрасная строка", flags: "gi"}; let str = "Моя прекрасная строка. И еще одна прекрасная строка."; let re = new RegExp(reObj.p, reObj.flags); for(let r; r = re.exec(str); ) { console.log(r.join(" - "), r.index) }

Все так, но после очистки от html индекс то поменяется

Все так, но после очистки от html индекс то поменяется

я думаю надо так сделать. Выбрать по регулярки строки из бд. Дальше дополнительной очистить их от Html тегов, профильтровать еще раз по регуляркам, запомнив все результаты. Далее посимвольно перебирвать каждую строку, сверяя с результатом регулярки, сразу же вставляя нужные тебе теги, и закрывая их перед < смволами

попробую сейчас набросать

код тебе

Все логично

Все логично

дай мне, какой нить тестовый результат с бд

и регулярку к ней

Но вопрос открыт, как понять куда обратно вставить html

Да я сам напишу код :) Мне бы понять как запомнить положение этих html

Да я сам напишу код :) Мне бы понять как запомнить положение этих html

вложенность тегов ограниченна?

нет

Да это и не важно

ок щя

Даже так https://jsfiddle.net/stomaks/jgexwfma/444/

Всем привет, подскажите У меня есть такой текст: текст текст текст текст текст 0 текст текст текст 0 <span a="0">текст текст </span> текст ...Мне в этом тексте нужно заменить все 0, кроме тех что внутри тега, на другой текст. Как мне это сделать ?

https://jsbin.com/fabagavoro/edit?js,console

из html’я в ячейке можно построить дерево ‘hello world <span>lorem ipsum <span>123</span></span> test’ -> 0: ‘hello world ’ 1: [ 0: ‘lorem ipsum ‘, 1: [ 0: ‘123’ ] ] 2: ‘ test’ дерево превращается текст который идет с ассоциативным массивом подсказок - какая часть текста к какой части дерева относится сам текст ‘hello world lorem ipsum 123 test’ массив подсказок [ [[0, 11], [0]], [[11, 22], [1, 0]], [[22, 25], [1, 1, 0]], [[25, 29], [2]], ]

Массив подсказок делится на - диапазоны по символов по индексу (левая часть) и путь в элемента в HTML дереве (правая часть)

Когда регулярка находит искомое в тексте - мы получаем некоторый диапазон индексов который с помощью массива с подсказками маппим на HTML, в результате знакоем на какое место в HTML’е применить выделение

@Stomaks

Найдет, если я тебя правильно понял конечно

попробуй вставить 0 в кавычка вне тега

Я вообще на сам тег не ориентировался

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

Коллеги, кто-нибудь знает чаты где есть freelance заказы на frontend/fullstack? Что-то не могу нагуглить. Нашёл только по битриксу.

А так ? https://jsbin.com/jaqurafolo/edit?js,console

))))))

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

да.. сейчас пытаюсь, это сложнее чем я думал

))

Было бы просто я бы тут не писал :)

По условиям автору же 0 надо убрать

Ну или что у него там вместо 0

сделать метод аргументов искомое

Тоесть через создание div, манипуляции с dom на 200000 строках это гиблое дело.

Друзья, добрый вечер Подскажите пожалуйста, как лучше сделать в простом калькуляторе что б считало + = / *

загвоздка у меня в том что б уже введенные какие то числа сумировались или вычетались от следующих введеных цифр

да задачу я себе сам поставил, просто треню простенькие задачи

цель сделать простенький калькулятор

@jobs_bot

понимаю, что для кого то это ерунда такое, но не рождаются же гуру

Друзья вот что я придумал function cutHTML ( str ) { let reg = /<\/?[A-Za-z]+[^>]*>/g, html = {}, temp; while ( (temp = reg.exec(str)) !== null ) { html[temp.index] = temp[0]; str = str.replace(temp[0], ""); } return { str: str, html: html }; } https://jsfiddle.net/stomaks/jgexwfma/501/

Эта функция вырежет html из текста при этом запомнив теги и их положение. Дальше можно будет выполнить спокойно поиск. Добавить тег выделения к остальным тегам. А в конце вставить обратно html-теги на место. Что думаете ?

Друзья вот что я придумал function cutHTML ( str ) { let reg = /<\/?[A-Za-z]+[^>]*>/g, html = {}, temp; while ( (temp = reg.exec(str)) !== null ) { html[temp.index] = temp[0]; str = str.replace(temp[0], ""); } return { str: str, html: html }; } https://jsfiddle.net/stomaks/jgexwfma/501/

Технически все еще есть случаи об которые данный regexp может сломаться Вопрос в том есть ограничения по вариативности HTML’я с которым мы работаем

👆

Технически все еще есть случаи об которые данный regexp может сломаться Вопрос в том есть ограничения по вариативности HTML’я с которым мы работаем

Какой например ?

Какой например ?

атрибуты: onclick=“alert(‘>’)” alt=“>”

также что то подобное можно засунуть в style

сейчас

атрибуты: onclick=“alert(‘>’)” alt=“>”

Да есть такое

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

Да есть такое

потому все еще предлагаю использовать DOMParser, получать дерево HTML’я и создавать массив с подсказками для поиска по тексту (я выше писал) и защитить себя от любых сценариев которые мы заранее не можем предусмотреть

подправил, должен вернуться обобьет с текстом и отдельно html

потому все еще предлагаю использовать DOMParser, получать дерево HTML’я и создавать массив с подсказками для поиска по тексту (я выше писал) и защитить себя от любых сценариев которые мы заранее не можем предусмотреть

Мне сложно понять этот принцип я все таки любитель а не про :)

Мне сложно понять этот принцип я все таки любитель а не про :)

могу подробнее расписать

Сейчас еще раз перечитаю, что ты написал

могу подробнее расписать

А массив подсказок нужен чтобы не получилось так? <i> ... <b> ... </i> ... </b>

А массив подсказок нужен чтобы не получилось так? <i> ... <b> ... </i> ... </b>

Массив подсказок нужен чтобы после того как ты в текст без HTML’я нашел искомое, то ты мог выделить это в самом HTML’е

А было так <i> ... <b> ... </b> </i> <b> ... </b>

то есть он указывает на точки в дереве

А массив подсказок нужен чтобы не получилось так? <i> ... <b> ... </i> ... </b>

Ну это вообще не валидный HTML

сейчас, пишу пример

Можно jquery пользовать, я его подключил, так к слову

var html = 'hello world <span>lorem ipsum <span>123</span></span> test' var parser = new DOMParser() var dom = parser.parseFromString(html, "text/html") var text = '' var hints = [] var transformDom = (element, path = []) => Array .from(element.childNodes) .map((child, i) => { const childPath = [...path, i] if (child instanceof Text) { const hint = [ [text.length, text.length + child.textContent.length], childPath ] text += child.textContent hints.push(hint) } else { transformDom(child, childPath) } }) transformDom(dom.body) console.log(JSON.stringify(hints, null, ‘\t’))

Сорри, сейчас загоню пример на сайт

Можно jquery пользовать, я его подключил, так к слову

вот что я придумал

(() => { const inputArrayFromDB = [ {id: 0, text: "Моя прекрасная строка. <span a=\"0\">Супер строка внтури.</span> Супер строка. кек"}, {id: 1, text: " Строка. Еще строки. <b>dd</b>Строка 3<b>dd</b><b>dd</b>. Уникальная стро<span a=\"0\">ка</span> ..."}, ]; const userPattern = {pattern: "строка", flags: "gi"}; class MyFilter { constructor(array, pattern, callback) { Object.assign(this, {array, pattern, callback}); } process(html, rg) { const {callback} = this; const htmlTagsArray = []; const text = html.replace(/\<[^]+?\>/g, (tag, index) => htmlTagsArray.push({tag, index}) && "" ); const matchArray = []; for(let match; match = rg.exec(text); ) { matchArray.push({index: match.index, match: match[0], length: match[0].length}); } if ( !matchArray.length ) { throw new Error("Not found"); } const selectArray = []; let shift = 0; let i = 0; let tag = htmlTagsArray.shift(); for(const match of matchArray) { while(true) { const m_index = match.index + shift; if ( !tag ) { let len = match.length; selectArray.push([m_index, len]); break; } if ( m_index < tag.index ) { let len = (tag.index - m_index); if ( len >= match.length ) { len = match.length; selectArray.push([m_index, len]); break; } else { match.length -= len; match.index += len; selectArray.push([m_index, len]); continue; } } if ( m_index >= tag.index ) { shift += tag.tag.length; tag = htmlTagsArray.shift(); continue; } break; } } let newHtml = ""; let prev = 0; for(const select of selectArray) { newHtml += html.substr(prev, select[0] - prev); prev = select[0] + select[1]; newHtml += callback( html.substr(select[0], select[1]) ); } newHtml += html.substr(prev); return newHtml; } getResult() { const {array, pattern} = this; const newArray = []; for(const item of array) { try { newArray.push({...item, newText: this.process(item.text, new RegExp(pattern.pattern, pattern.flags))}); } catch(e) { console.log(e) } } return newArray; } } const result = new MyFilter(inputArrayFromDB, userPattern, (substr) => { return `<span class="select-substr">${substr}</span>`; }).getResult(); console.log(result); })();