如何使用 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中文網其他相關文章！