Maison > interface Web > tutoriel CSS > Comment puis-je mettre efficacement en gras des chaînes de texte spécifiques dans du contenu chargé dynamiquement à l'aide de jQuery ?

Comment puis-je mettre efficacement en gras des chaînes de texte spécifiques dans du contenu chargé dynamiquement à l'aide de jQuery ?

Patricia Arquette
Libérer: 2024-11-24 18:53:14
original
1003 Les gens l'ont consulté

How Can I Efficiently Bold Specific Text Strings within Dynamically Loaded Content Using jQuery?

Rechercher et mettre en gras des chaînes de texte avec jQuery

Trouver une chaîne de texte spécifique dans un élément et modifier son apparence est une tâche courante lorsque l'on travaille avec contenu dynamique. Dans jQuery, cela peut être fait efficacement. Cependant, si votre approche initiale ne donne pas les résultats souhaités, dépannons et trouvons une solution.

L'extrait de code que vous avez fourni vise à mettre en gras le texte contenant la chaîne "cross genre" dans un élément avec l'ID " about_theresidency." Bien que l'intention soit claire, il y a une petite erreur dans sa mise en œuvre :

$('#about_theresidency:contains("cross genre")').css({'font-weight':'bold'});
Copier après la connexion

Le problème réside dans le sélecteur ":contains", qui ne fonctionne pas bien lorsque le texte est chargé dynamiquement comme vous l'avez décrit. . Pour cibler efficacement le texte souhaité, nous pouvons utiliser la fonction replace() en conjonction avec html() :

var html = $('p').html();
$('p').html(html.replace(/cross genre/gi, '<strong>$&</strong>'));
Copier après la connexion

Ce code remplace le texte "cross genre" par une version de balise forte, le mettant efficacement en gras.

Alternativement, vous pouvez également créer un plugin personnalisé pour encapsuler cette fonctionnalité :

$.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']
});
Copier après la connexion

Avec ce plugin, vous pouvez désormais utiliser le Méthode wrapInTag() pour envelopper les mots spécifiés dans la balise souhaitée, par exemple « em » pour l'emphase ou « strong » pour le gras.

En incorporant ces correctifs, vous pouvez rechercher et modifier efficacement des chaînes de texte dans votre code jQuery , garantissant que le contenu dynamique est présenté avec le style souhaité.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal