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

Question

Есть инпут, при вводе какого-то слова или буквы, которые встречаются несколько раз в тексте, эти повторения будут выделены тегом mark. Я нахожу одинаковые слова с помощью регулярного выражения, а потом заменяю их с помощью метода replace(). Однако при таком раскладе все буквы будут маленькие, так как на замену идет буква, которая была в инпуте. И соответственно, все повторяющиеся буквы большого регистра (или одинаковые слова, начинающиеся с большой буквы) будут заменены на те же буквы, но с маленьким регистром. Как сделать так, чтобы регистры букв при замене соответствовали изначальным регистрам?

const text = document.querySelector('.text');

const input = document.querySelector('.input');

input.addEventListener('input', () => {
    let value = input.value
    words(text, value)
    
})

function words(text, search) {
    let words = text.textContent
    if (words.indexOf(`${search}`) != -1 && search != '' && search != ' ') {
        let searchAll = new RegExp(search, 'gi')
        let newText = words.replace(searchAll, '<mark>' + search + '</mark>')
        text.innerHTML = newText
    } else {
         console.log('did not find');
    }
}

Answer 1

Зачем indexOf, когда есть test ? Думаю, что в этом месте была проблема.

const text = document.querySelector('.text');
const input = document.querySelector('.input');

input.addEventListener('input', words);

function words() {
  let search = this.value;
  let newText = text.textContent;
  let rExp = new RegExp(`(${search})`, 'gi');
  if (rExp.test(`${newText}`) && search) {
    text.innerHTML = newText.replace(rExp, '<mark>$1</mark>');
  } else {
    console.log('did not find');
    text.innerHTML = newText;
  }
}

<input class="input">
<p class="text">Есть инпут, при вводе какого-то слова или буквы, которые встречаются несколько раз в тексте, эти повторения будут выделены тегом mark. Я нахожу одинаковые слова с помощью регулярного выражения, а потом заменяю их с помощью метода replace().</p>

БЛОГ НА HUSL

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

Ответы (1 шт):