Supposons qu'une page Web comporte une chaîne telle que "Je suis une chaîne simple" que je souhaite rechercher. Comment pourrais-je procéder à l'aide de JQuery?
Supposons qu'une page Web comporte une chaîne telle que "Je suis une chaîne simple" que je souhaite rechercher. Comment pourrais-je procéder à l'aide de JQuery?
Réponses:
jQuery a la méthode contains. Voici un extrait pour vous:
<script type="text/javascript">
$(function() {
var foundin = $('*:contains("I am a simple string")');
});
</script>
Le sélecteur ci-dessus sélectionne tout élément contenant la chaîne cible. Le foundin sera un objet jQuery qui contient tout élément correspondant. Voir les informations de l'API sur: https://api.jquery.com/contains-selector/
Une chose à noter avec le caractère générique «*» est que vous obtiendrez tous les éléments, y compris vos éléments html et body, dont vous ne voulez probablement pas. C'est pourquoi la plupart des exemples de jQuery et d'autres endroits utilisent $ ('div: contains ("I am a simple string")')
Normalement, les sélecteurs jQuery ne recherchent pas dans les «nœuds de texte» du DOM. Cependant, si vous utilisez la fonction .contents (), les nœuds de texte seront inclus, vous pouvez alors utiliser la propriété nodeType pour filtrer uniquement les nœuds de texte et la propriété nodeValue pour rechercher la chaîne de texte.
$ ('*', 'corps') .etSelf () .Contenu() .filter (fonction () { renvoyer this.nodeType === 3; }) .filter (fonction () { // Correspond uniquement lorsque contient une "chaîne simple" n'importe où dans le texte renvoie this.nodeValue.indexOf ('chaîne simple')! = -1; }) .each (fonction () { // Faites quelque chose avec this.nodeValue });
.andSelf()
. Depuis api.jquery.com/andSelf : "Les objets jQuery conservent une pile interne qui conserve la trace des modifications apportées à l'ensemble d'éléments mis en correspondance. Lorsqu'une des méthodes de parcours DOM est appelée, le nouvel ensemble d'éléments est poussé vers la pile. Si l'ensemble d'éléments précédent est également souhaité. .andSelf () peut vous aider. " Je ne vois aucun contexte précédent, que me manque-t-il?
Cela sélectionnera uniquement les éléments feuilles qui contiennent "Je suis une simple chaîne".
$('*:contains("I am a simple string")').each(function(){
if($(this).children().length < 1)
$(this).css("border","solid 2px red") });
Collez ce qui suit dans la barre d'adresse pour le tester.
javascript: $('*:contains("I am a simple string")').each(function(){ if($(this).children().length < 1) $(this).css("border","solid 2px red") }); return false;
Si vous voulez saisir juste "Je suis une simple chaîne" . Enveloppez d'abord le texte dans un élément comme celui-ci.
$('*:contains("I am a simple string")').each(function(){
if($(this).children().length < 1)
$(this).html(
$(this).text().replace(
/"I am a simple string"/
,'<span containsStringImLookingFor="true">"I am a simple string"</span>'
)
)
});
puis faites cela.
$('*[containsStringImLookingFor]').css("border","solid 2px red");
Si vous voulez juste le nœud le plus proche du texte que vous recherchez, vous pouvez utiliser ceci:
$('*:contains("my text"):last');
Cela fonctionnera même si votre code HTML ressemble à ceci:
<p> blah blah <strong>my <em>text</em></strong></p>
L'utilisation du sélecteur ci-dessus trouvera la <strong>
balise, car c'est la dernière balise qui contient toute cette chaîne.
<p>my text <b>my text</b></p>
- supprimer les ancêtres de la <b>
balise serait perdre l'autre match
J'ajoute simplement à la réponse de Tony Miller, car cela m'a permis d'atteindre 90% de ce que je cherchais, mais cela n'a toujours pas fonctionné. L'ajout .length > 0;
à la fin de son code a fait fonctionner mon script.
$(function() {
var foundin = $('*:contains("I am a simple string")').length > 0;
});
foundin += '*';
cette fonction devrait fonctionner. fait essentiellement une recherche récursive jusqu'à ce que nous obtenions une liste distincte de nœuds foliaires.
function distinctNodes(search, element) {
var d, e, ef;
e = [];
ef = [];
if (element) {
d = $(":contains(\""+ search + "\"):not(script)", element);
}
else {
d = $(":contains(\""+ search + "\"):not(script)");
}
if (d.length == 1) {
e.push(d[0]);
}
else {
d.each(function () {
var i, r = distinctNodes(search, this);
if (r.length === 0) {
e.push(this);
}
else {
for (i = 0; i < r.length; ++i) {
e.push(r[i]);
}
}
});
}
$.each(e, function () {
for (var i = 0; i < ef.length; ++i) {
if (this === ef[i]) return;
}
ef.push(this);
});
return ef;
}