Пошук та заміна слів (тексту) за допомогою Javascript

Якщо вам потрібно знайти та замінити який-небудь текст за допомогою Javascript, то для цього слід використати метод replace().

Пошук та заміна одного слова

let text = "Вітаю, Дмитре!";
let result = text.replace("Дмитре", "Юрій");
alert (result);

У цьому прикладі ми присвоюємо змінній text значення "Вітаю, Дмитре!". Після цього ми шукаємо слово Дмитре у змінній text і змінюємо його на слово Юрій. Ну і останнім рядком коду, ми виводимо повідомлення зі зміненим текстом у змінній result.

Мінус цієї інструкції в тому, що пошук та заміна закінчується відразу після того, як було знайдено слово Дмитре. Тобто поміняти якесь слово ми можемо лише один раз.

Щоб змінити кілька слів у тексті, потрібно використовувати інструкцію глобального пошуку та заміни слів.

Глобальна заміна

let text = "У мене зелені очі та у моєї сестри зелені очі";
let result = text.replace(/зелені/g, "блакитні");
alert (result);

У цьому прикладі ми присвоюємо змінній text значення "У мене зелені очі та у моєї сестри зелені очі". Після цього здійснюється пошук усіх слів "зелені" і заміна їх на слово "блакитні". В результаті користувачеві буде виведено повідомлення "У мене блакитні очі та у моєї сестри блакитні очі".

Пошук та заміна в HTML документі

Для пошуку та заміни слів або тегів в HTML документі використовується наступна інструкція:

document.body.innerHTML = document.body.innerHTML.replace(/Текст який потрібно знайти та замінити/g, 'Текст, який потрібно вставити замість знайденого');

Наприклад, якщо нам потрібно знайти в HTML документі слово Ukrainian та замінити його на текст "Перейти на українську мову", то для цього ми напишемо наступний код:

document.body.innerHTML = document.body.innerHTML.replace(/Ukrainian/g, 'Перейти на українську мову');