如何使用 jQuery 将段落中的特定文本加粗？

使用 jQuery 操作文本：增强特定字符串

在 jQuery 中，用户经常遇到需要在文档中定位特定文本并修改其文本的情况。外貌。一种常见的情况是通过将某些文本设为粗体来强调它。

考虑以下 jQuery 代码，该代码尝试对 ID 为“about_theresidency”的段落中的特定短语进行粗体显示：

` `
$(window).load(function() {
$('#about_theresidency:contains("cross genre")').css({'font-weight':'bold'});
});
``

此代码旨在查找 ID 为“about_theresidency”的元素包含文本“跨流派”，然后应用 CSS 属性“font-weight”以粗体显示该特定文本。但是，由于“about_theresidency”中文本的动态性质，此代码可能无法按预期工作。

要解决此问题，请考虑使用以下方法：

var html = $('p').html();
$('p').html(html.replace(/world/gi, '<strong$&</strong>'));

此处，我们利用replace()方法来查找段落中所有出现的文本“world”，并将它们替换为由强标签包围的相同文本。这可以有效地加粗所需的文本，而无需依赖 jQuery 的 :contains 选择器。

或者，您可以利用自定义 jQuery 插件以获得更大的灵活性：

$.fn.wrapInTag = function(opts) {

  var tag = opts.tag || 'strong'
    , words = opts.words || []
    , regex = RegExp(words.join('|'), 'gi') // case insensitive
    , replacement = '<'+ tag +'>$&</'+ tag +'>';

  return this.html(function() {
    return $(this).text().replace(regex, replacement);
  });
};

// Usage
$('p').wrapInTag({
  tag: 'em',
  words: ['world', 'red']
});

此插件允许您包装任何指定的内容任何所需 HTML 标签中的文本，提供对文本操作过程的更好控制。

以上是如何使用 jQuery 将段落中的特定文本加粗？的详细内容。更多信息请关注PHP中文网其他相关文章！