Как я могу сделать одну строку текста жирным шрифтом в параграфе JQuery - PullRequest
1 голос
/ 28 февраля 2020

Я хочу сделать Let's get you registered жирным шрифтом. Благодаря моему коду весь текст выделяется жирным шрифтом, чего я не хочу.

$(function() {
  $('.page-register-new .variant-body').text('Let`s get you registered. Please fill in the form below and we will email you confirmation that your registration has been completed. All fields are mandatory. ');

  $('this:contains("Let`s get you registered")').css({
    'font-weight': 'bold'
  });
})

Ответы [ 2 ]

1 голос
/ 28 февраля 2020

Вы можете заменить текст тегом <b>, например:

$('.variant-body:contains("Let`s get you registered")').html(function(_, html) {
    return html.replace(/(Let`s get you registered)/g, '<b>$1</b>');
});

ДЕМО ЗДЕСЬ:

$('.page-register-new .variant-body').html('Let`s get you registered. Please fill in the form below and we will email you confirmation that your registration has been completed. All fields are mandatory.');

$('.page-register-new .variant-body:contains("Let`s get you registered")').html(function(_, html) {
  return html.replace(/(Let`s get you registered)/g, '<b>$1</b>');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="page-register-new">
  <div class="variant-body"></div>
</div>
0 голосов
/ 28 февраля 2020

Вы не можете влиять на стилизацию отдельных слов (или групп слов) в пределах одного текстового узла. Вам необходимо поместить этот контент в его собственный элемент и применить к нему стилизацию:

$(function() {
  $('.page-register-new .variant-body').html('<span>Let\'s get you registered.</span> Please fill in the form below and we will email you confirmation that your registration has been completed. All fields are mandatory.');
})
.page-register-new .variant-body span { font-weight: bold; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="page-register-new">
  <div class="variant-body"></div>
</div>

В качестве альтернативы вы можете просто использовать элемент b напрямую:

$(function() {
  $('.page-register-new .variant-body').html('<b>Let\'s get you registered.</b> Please fill in the form below and we will email you confirmation that your registration has been completed. All fields are mandatory.');
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="page-register-new">
  <div class="variant-body"></div>
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...