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

@Shark_vil · Регистрация: 08.11.2015

Студворк — интернет-сервис помощи студентам

Здравствуйте, есть вопрос. В JS я не ахти, однако понадобилось реализовать одну штуку.

Нужно найти все вхождения на странице, по типу [TAG]Какой то текст[/TAG] и заменить их вместе с самими "[TAG]". Однако я хочу хранить внутри зашифрованные сообщения, и перед тем как мне заменить текст, нужно как то в/перед string.replace его достать (без тегов, разумеется), и дешифровать в ответе.

Собстна, как это можно реализовать? Я уже 5 часов голову ломаю, увы, ничего работоспособного не вышло.

@Mr_Sergo · 03.06.2019, 22:53

Shark_vil,

https://codepen.io/Mr_Sergo/pe... itors=1010

HTML5
1
2
<span>Первый зашифрованный текст</span>
<span>Еще один зашифрованный текст</span>

JavaScript
1
2
3
4
5
6
7
let span = document.querySelectorAll('span'),
    texts = [...span].map(e => e.innerText );  // получаем все тексты из интересующего тега
 
for(let i = 0; i < span.length; i++){  // меняем теги, вставляем дешифрованные тексты, выводим на страницу
    span[i].remove();
    document.body.insertAdjacentHTML('beforeEnd', `<div>${texts[i]} | теперь это не спан а див</div>`);
}

@Devmastery · 03.06.2019, 23:01

Mr_Sergo,

А не проще регуляркой сделать?

JavaScript
1
2
3
4
5
6
let str = "[TAG]Какой то текст[/TAG]";
let newStr = str.replace(/\[TAG\](.*)\[\/TAG\]/gi, function(str, text){
    // тут текст в скобках между тегами, можно делать все, что надо
    console.log(text);
    return "Какой то другой текст";
});

@Mr_Sergo · 03.06.2019, 23:04

Devmastery, не силен

@Melvil · 03.06.2019, 23:21

Devmastery, регуляркой проще, но у вас неверно.
1. Можем не экранировать закрывающие квадратные скобки, но это мелочь.
2. В случае с поиском любой строки между тегами нам нужно применить "ленивый" квантификатор. Т.е. будет

JavaScript
1
(.*?)

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

JavaScript
1
2
3
4
5
6
let str = "[TAG]Какой то текст[/TAG][TAG]Ещё текст[/TAG]";
let newStr = str.replace(/\[TAG](.*?)\[\/TAG]/gi, function(str, text){
    // тут текст в скобках между тегами, можно делать все, что надо
    console.log(text);
    return "Какой то другой текст";
});

@Devmastery · 04.06.2019, 07:48

Melvil,

Точно, про лень забыл

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

@Shark_vil 0 / 0 / 0 Регистрация: 08.11.2015 Сообщений: 8

	Как изменить все вхождения, но перед этим получить найденный текст? 03.06.2019, 21:47. Показов 1886. Ответов 5 Метки изменение значения, поиск текста, регулярные выражения, редактирование ответа (Все метки) Здравствуйте, есть вопрос. В JS я не ахти, однако понадобилось реализовать одну штуку. Нужно найти все вхождения на странице, по типу [TAG]Какой то текст[/TAG] и заменить их вместе с самими "[TAG]". Однако я хочу хранить внутри зашифрованные сообщения, и перед тем как мне заменить текст, нужно как то в/перед string.replace его достать (без тегов, разумеется), и дешифровать в ответе. Собстна, как это можно реализовать? Я уже 5 часов голову ломаю, увы, ничего работоспособного не вышло. 0

@Mr_Sergo 2037 / 1096 / 409 Регистрация: 29.04.2016 Сообщений: 2,625
	03.06.2019, 23:04
	Devmastery, не силен 0

@Devmastery 242 / 107 / 43 Регистрация: 02.05.2019 Сообщений: 170
	04.06.2019, 07:48
	Melvil, Точно, про лень забыл 0

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

Решение