Оборачивания текста по регулярному выражению с помощью JavaScript

Содержимое:

Добрый день, решил записать для себя небольшой сниппет для списков. Иногда бывает так что в элементе списка нужно часть текста выделить в жирное начертание, а часть оставить с тонки начертание.

Например такой текст будет выглядеть так:

Для того чтобы заполнить данный список из админки, без знаний HTML кода не обойтись, так как для реализации нужно числа обернуть в span и задать ему определённые стили.

  • 84800 проданных изделий
  • 102 сотрудника
  • 5673 товара в каталоге

Таким образом код должен выглядеть вот так

<ul>
    <li><span>84800</span> проданных изделий</li>
    <li><span>102</span> сотрудника</li>
    <li><span>5673</span> товара в каталоге</li>
</ul>

Для этого решения я нашёл наиболее красивое решение. Мы будет оборачивать числа с помощью JavaScript (в моём случает это jQuery).

Пробегаемся по списку с помощью метода each, далее ищем в значение числа, с помощью регулярного выражения в методе replace() и оборачиваем их тегом span.

$("ul li").each(function() {
    $(this).html($(this).text().replace(/([0-9.]+)/g, '<span>$1</span>'))
})

На этом всё!
Больше интересных статей в нашей группе - https://vk.com/progtime
Вы так же можете разместить свой вопрос на нашем форуме, где другие программисты смогут вам помочь в решение вашей задачи - https://vk.com/prog_time
Так же прокачивайте свои навыки на нашем канале - https://www.youtube.com/c/ProgTime