JQuery - Использование регулярного выражения для выделения образца ссылки жирным шрифтом

Поскольку вы используете jQuery, вот решение, ориентированное на это:

var pattern = /([0-2][0][0-9][0-9])\.([0-1][0-9])\.([0-3][0-9])/;

// select each `a` element
$('a').each(function () {  
  // store individual `a` elements
  var elem = $(this);  
  // replace the text (date in your case) using the regex pattern and  
  // set the content of the `a` element with the new, formatted date
  elem.html(elem.text().replace(pattern, function (date) {
    // here you can apply your various inline styles
    return '<span style = "font-weight: 600">' + date + '</span>';
  }));
});

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>
    <a href = "#">2018.03.08 Event #1</a>
  </li>
  <li>
    <a href = "#">2018.02.12 Event #2</a>
  </li>
  <li>
    <a href = "#">2017.12.04 Event #3</a>
  </li>
</ul>

В вашем случае вам не нужен модификатор i в вашем регулярном выражении, поскольку ваш шаблон регулярного выражения не должен обрабатывать символы, чувствительные к регистру, а только числа.

Кроме того, вам не нужен модификатор g, так как в вашем конкретном случае, исходя из вашего примера, вам нужно сопоставить шаблон один раз.

Во-первых, решение проблемы:

// a date-pattern regular expression literal:
let datePattern = /([0-2][0-9]{3,3}\.[0-1][0-9]\.[0-3][0-9])/gi;

// select all <a> elements,
// and iterate over the returned collection with the
// .html() method:
$('a').html(function() {

  // here we return the modified string of text,
  // wrapping any patterns matching the date pattern,
  // with the '<b>' and '</b>' tags; as this text is
  // returned to the HTML method this is parsed as
  // HTML:
  return this.textContent.replace(datePattern, '<b>$1</b>');
});

let datePattern = /([0-2][0-9]{3,3}\.[0-1][0-9]\.[0-3][0-9])/gi;

$('a').html(function() {
  return this.textContent.replace(datePattern, '<b>$1</b>');
});

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul>
  <li>
    <a href = "#">2018.03.08 Event #1</a>
  </li>
  <li>
    <a href = "#">2018.02.12 Event #2</a>
  </li>
  <li>
    <a href = "#">2017.12.04 Event #3</a>
  </li>
</ul>

Также стоит отметить, что, хотя jQuery и делает могут упростить некоторые вещи, описанное выше просто сделать с помощью обычного JavaScript:

let datePattern = /([0-2][0-9]{3,3}\.[0-1][0-9]\.[0-3][0-9])/gi;

// converting the result of the contained expression
// into an Array, in order to gain access to Array methods:
Array.from(

  // retrieving all <a> elements from the document:
  document.querySelectorAll('a')

// using Array.prototype.forEach() to iterate over
// the Array of <a> elements:
).forEach(function(aElement) {
  // 'aElement' refers to the current <a> element
  // of the Array of <a> elements.

  // here we update the innerHTML of the current <a> element
  // to be equal to the text of the current <a> element, after
  // wrapping any date-patterns - as before - with the '<b>'
  // and '</b>' tags:
  aElement.innerHTML = aElement.textContent.replace(datePattern, '<b>$1</b>');
});

let datePattern = /([0-2][0-9]{3,3}\.[0-1][0-9]\.[0-3][0-9])/gi;

Array.from(
  document.querySelectorAll('a')
).forEach(function(aElement) {
  aElement.innerHTML = aElement.textContent.replace(datePattern, '<b>$1</b>');
});

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul>
  <li>
    <a href = "#">2018.03.08 Event #1</a>
  </li>
  <li>
    <a href = "#">2018.02.12 Event #2</a>
  </li>
  <li>
    <a href = "#">2017.12.04 Event #3</a>
  </li>
</ul>

А теперь к проблемам:

$date = '/([0-2][0][0-9][0-9]).([0-1][0-9]).([0-3][0-9])/gi';

Здесь вы объявили глобальную переменную (плохая практика, поскольку эта глобальная переменная может быть использована / перезаписана в другом месте непредсказуемо). Также регулярное выражение было заключено в строковый литерал, что означает, что регулярное выражение является строкой, а не регулярным выражением вообще.

Кроме того, селектор :contains() работает только со строками, как ясно сказано в документации.

Итак, в исходном коде у вас была строка (которая выглядела как регулярное выражение), которую искали, но не нашли ни в одном из элементов <a>.

Кроме того, если бы было обнаружено, что конечным результатом вызова вашего метода css() было бы обертывание самого элемента <a> в элементе <b>, а не обертывание строки даты. Я думаю, это был твой план.

Рекомендации:

• JavaScript:
  • Array.prototype.forEach().
  • Array.from().
  • document.querySelectorAll().
  • Регулярные выражения JavaScript.
  • String.prototype.replace().
• jQuery:
  • :contains().
  • .html().

Простое и хорошее решение:

var regex = new RegExp("[0-9]"); // expression here

$("a").filter(function () {
    return regex.test($(this).text()); 
}).css('font-weight','100');