Как изменить цвет подстроки через JS?

Question

[QnaTwitt]

Есть поле input для поиска по элементам, можно как-то изменять совпадающей подстроки через js?

codesandbox

Как-то так должно быть при вводе слова в input

Comments

[Вадим]

https://stackoverflow.com/questions/9051369/highli...

[QnaTwitt]

Вадим, там наверное не совсем то что мне нужно, я получаю строку из input и мне нужно найти эту же строку в другой строке, и её выделить в какой-то цвет...

То есть не элемент передавать в функцию, и я не знаю start\end

[Вадим]

QnaTwitt,

я не знаю start\end

Так а как Вы иначе хотите выделять?
Чтобы что-то выделить нужно это обернуть в тэг.
Чтобы обернуть в тэг, нужно знать как минимум индекс, с начинается искомая подстрока и длину подстроки.
То есть Вы проходитесь по всем элементам, находите там свою подстроку и заменяется по индексу подстроки просто текст на span\mark.

А element, который в примере на SO это все ваши строки. То есть Вы их перебираете и в них заменяете.

[Вадим]

QnaTwitt, а ещё там ниже есть пример на https://github.com/bvaughn/react-highlight-words#usage