Comment puis-je mettre en gras des chaînes de texte spécifiques dans un paragraphe à l'aide de jQuery ?

Chaînes de texte en gras dans jQuery

Vous recherchez une solution jQuery pour mettre en évidence une chaîne de texte spécifique dans un paragraphe en la mettant en gras. Cependant, votre code ne produit pas le résultat souhaité :

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

Ce code vise à cibler le texte avec la phrase "cross genre" au sein de l'élément avec l'ID "about_theresidency" et à appliquer la propriété CSS "font -weight" pour le mettre en gras. Cependant, cela reste inefficace.

Solution

Pour mettre en gras des chaînes de texte à l'aide de jQuery, vous pouvez utiliser la méthode replace() avec html(). Le code suivant montre comment :

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

Cet extrait de code :

1. Stocke le contenu HTML du paragraphe dans la variable html.
2. Utilise le remplacement( ) sur HTML pour rechercher toutes les occurrences du texte "world" (insensible à la casse) et l'envelopper dans balises.
3. Mise à jour le contenu HTML du paragraphe avec la chaîne modifiée pour appliquer la mise en forme en gras.

Astuce supplémentaire

Le code peut être affiné dans un plugin :

$.fn.wrapInTag = function(opts) {

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

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

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

Ce plugin vous permet d'envelopper des mots spécifiques dans des balises HTML. Dans l'exemple fourni, les mots « monde » et « rouge » sont entourés de balises.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!