Форум программистов, компьютерный форум, киберфорум
JavaScript для начинающих
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.60/5: Рейтинг темы: голосов - 5, средняя оценка - 4.60
648 / 313 / 34
Регистрация: 31.05.2019
Сообщений: 2,364

Как подсветить текст?

09.01.2020, 21:08. Показов 1124. Ответов 2
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Есть у меня пару функций, которые возвращают две строки


"Какие произведения писателей заставляются задуматься о великом?" --- Исходная строка
"Какие произведение писателей заставляются задуматься великом?" ---- Строка, которую вернула функция

Мне надо, чтобы в исходной строке подсвечивалось так

Какие произведения писателей заставляются задуматься о великом

Прошу помощи
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
09.01.2020, 21:08
Ответы с готовыми решениями:

Клик по div. Открыть окно, вписать текст, подсветить код
Сайт на Wordpress. Там плагин подсветки кода Crayon Syntax Highlighter. Моя задача такая, чтобы при клике на определенный текст,...

Как подсветить input через js
<form class="form-horizontal" action="#" method="post" id="my_form"> <div class="form-group"> <label...

Rzslider как подсветить активный элемент ?
Здравствуйте, я хочу по поводу этой либы узнать мне бы хотелось выделить в стилях активный элемент, да вот только класс rz-selected...

2
Эксперт JSЭксперт HTML/CSS
2151 / 1496 / 651
Регистрация: 16.04.2016
Сообщений: 3,696
10.01.2020, 04:02
Sneykas, навскидку - https://codepen.io/qwerty_wasd/pen/xxbWmNv
JavaScript
1
2
3
4
5
let opHiLight = {
  srcStr: `Какие произведения писателей заставляются задуматься о великом?`,
  getCStrLight: str => str.split` `.map(w => RegExp(str.replace(/(\sо\s)|([\?\!\.]+)/gim, ` `).trim().replace(/\s/gim, `|`)).test(w) ? `<b>${w}</b>`: w).join` `,
};
document.writeln(opHiLight.getCStrLight(opHiLight.srcStr));
Упреждая возможное недоумение:
1. Сохранить отредактированную исходную строку.
2. Разбить её в массив, сохранить.
3. Разбить в массив исходную строку.
4. Пройтись по массиву исходной строки, сверяясь со значениями массива отредактированной, при совпадении добавить теги.
5. Сконкатенировать значения полученного массива.
6.Вывести на экран.
1
Эксперт JS
2463 / 1769 / 625
Регистрация: 11.07.2016
Сообщений: 4,067
10.01.2020, 15:47
HTML5
1
2
3
<input id="srcstr" oninput="compare()" value = "Какие произведения писателей заставляются задуматься о великом?">
<input id="newstr" oninput="compare()" value = "Какие произведения писателей заставляют задуматься великом?">
<div id="res"></div>
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function compare() {
  const srcString = Array.from(srcstr.value);
  const newString = Array.from(newstr.value);
  let result = '';
  for (let i = 0, j = 0; i < srcString.length; i++, j++) {
    if (srcString[i] !== newString[j]) {
      result += '</span>';
      if (newString[j]) while (i < srcString.length && srcString[i] !== newString[j]) {
        result += srcString[i];
        i++;
      }
      result += '<span>';
    }
    result += srcString[i] || '';
  }
  result = `<span>${result}</span>`;
  res.innerHTML = result;
}
 
compare();
https://codepen.io/Balanaar/pen/ExaLaWe
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
10.01.2020, 15:47
Помогаю со студенческими работами здесь

Как подсветить текст в TRichEdit
Как подсветить текст в TRichEdit? Я пытался это сделать вот таким кодом, procedure rEditChange(Sender: TObject); var SInt:...

подсветить текст в RichEdit
Необходимо выделить (подсветить) слово word в строке, а - начало слова. вместо этого я получаю курсор в конце слова. void...

Найти и подсветить текст в WEBBrowser
Доброго времени суток! По нажатию кнопки Read открывается htm файл с текстом, нужно организовать поиск и подсветку найденного слова. Не...

Подсветить весь найденный текст в richtextbox
Добрый день! Нужно в richtextbox подсветить желтым все найденные совпадения для слова. Пишу так: private void...

Как подсветить изображение
У меня на форме плитка из 9 изображений, как сделать чтобы выбранное изображение подсвечивалось?


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Новые блоги и статьи
Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly
8Observer8 24.01.2026
Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а привычная функция main(). . .
моя боль
iceja 24.01.2026
Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .
Модель сукцессии микоризы
anaschu 24.01.2026
Решили писать научную статью с неким РОманом
http://iceja.net/ математические сервисы
iceja 20.01.2026
Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .
http://iceja.net/ сервер решения полиномов
iceja 18.01.2026
Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .
Расчёт переходных процессов в цепи постоянного тока
igorrr37 16.01.2026
/ * Дана цепь(не выше 3-го порядка) постоянного тока с элементами R, L, C, k(ключ), U, E, J. Программа находит переходные токи и напряжения на элементах схемы классическим методом(1 и 2 з-ны. . .
Восстановить юзерскрипты Greasemonkey из бэкапа браузера
damix 15.01.2026
Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .
Сукцессия микоризы: основная теория в виде двух уравнений.
anaschu 11.01.2026
https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru